Hi Support Team,

When we use filter in the dropdownlist the WAVE is complaining of the missing Label inside the list box (for the search box). Please advise for the fix.

Below is the code, when add the attribute of Filter then WAVE complains about that as shown below screen shot from Telerik Demo site

 @(Html.Kendo().DropDownListFor(m => m.OfficerIDTypeID)
                                            .DataValueField(nameof(ReferenceCodeDTO.ID))
                                            .DataTextField(nameof(ReferenceCodeDTO.Label))
.Filter(FilterType.Contains)
                                            .HtmlAttributes(new { style = "width: 100%", tabindex = ++tabIndex })
                                            .ValuePrimitive(true)
                                            .OptionLabel("")
                                            .HtmlAttributes(new { style= "aria-labelledby:OfficerIDTypeID" })
                                            .BindTo(await refCodeLookupHelper.GetCodesByReferenceCodeType("PersonIdentifierTypeKey"))
                                            .Events(e => e.Change("onChangeOfficerTypeId"))
                                            )

Having a floating label functionality similar to the one available for the native Vue DropDownList, would be nice to have.

https://www.telerik.com/kendo-vue-ui/components/dropdowns/floating-labels/

If there is a text binding to the item that has a script tag injected, the Core component will break its initialization instead of encoding it as it is done for the Telerik UI for ASP.NET MVC DropDownList helper.

        @(Html.Kendo().DropDownList()
            .Name("DDL")
            .HtmlAttributes(new { style = "width:100%" })
            .OptionLabel("Select...")
            .DataTextField("text")
            .DataValueField("value")
            .Height(310)
            .BindTo(new List<object> {
                new { text = "Test", value = 0 },
                new { text = "<script>alert(123)</script>", value = 0 }
            })
        )

Result:

Bug report

The data attributes are not rendered for the DropDownlist when bound to Model in Razor Pages.

Reproduction of the problem

View:

@page
@model TelerikAspNetCoreApp12.Pages.IndexModel

<form>
    @(Html.Kendo().DropDownList()
            .Name("fabric")
            .OptionLabel("Select...")
            .DataTextField("Text")
            .DataValueField("Value")
            .BindTo(Model.Data)
            .Filter("contains")
    )
    <input type="submit" />
</form>

Back end:

namespace TelerikAspNetCoreApp12.Pages
{
    public class IndexModel : Microsoft.AspNetCore.Mvc.RazorPages.PageModel
    {
        public List<TestModel> Data { get; set; } = new List<TestModel>();

        public void OnGet()
        {
            for (int i = 1; i <= 100; i++)
            {
                Data.Add(new TestModel() { Text = "product" + i, Value = i.ToString() });
            }
        }
    }
}

Model:

namespace TelerikAspNetCoreApp12.Models
{
    public class TestModel
    {
        [Required(ErrorMessage = "Please select")]

        public string Text { get; set; }

        public string Value { get; set; }
    }
}

Inspect the input field for the DropDownList. It does not have data-val and data-val-required attributes.

Current behavior

The data attributes are not being rendered.

Expected/desired behavior

The data attributes should be rendered.

Environment

• Kendo UI version: 2019.2.619
• jQuery version: x.y
• Browser: [all]