Form editor throws a client error when using DeferredScriptFile()

[kendo-bot]

Bug report

When deferring the component scripts to a file and a specified item of a Form HtmlHelper has a defined editor through the Editor() configuration, a client-side error is thrown:

"Uncaught Error: Syntax error, unrecognized expression: #"

Reproduction of the problem

1. Enable the global deferred initialization.

2. Define a Form HtmlHelper with a ComboBox editor for one of its items:

@model FormViewModel

@(Html.Kendo().Form<FormViewModel>()
    .Name("form")
    .HtmlAttributes(new { action = @Url.Action("SubmitData", "Home"), method = "POST" })
    .FormData(Model)
    .Items(items =>
    {
        items.Add()
            .Field(f => f.Username)
            .Label(l => l.Text("Username:"));

        items.Add()
        .Field(f => f.City)
        .Label(l => l.Text("City"))
        .Editor(editor => editor
          .ComboBox()
          .DataTextField("Text")
          .DataValueField("Value")
          .BindTo(new List<SelectListItem>()
          {
            new SelectListItem() { Text = "City A", Value = "1" },
            new SelectListItem() { Text = "City B", Value = "2" },
            new SelectListItem() { Text = "City C", Value = "3" }
          })
        );
    })
)
@(Html.Kendo().DeferredScriptFile())

3. When the page with the Form is loaded, open the browser console and examine the error. Review the content of the loaded kendo-deferred-scripts-xxxxx.js file - the ComboBox initialization script is included after the Form initialization script. Attached you can find screenshots.

When using the TagHelper version of the Form, the ComboBox initialization script is included in the kendo-deferred-scripts-xxxxx.js file before the initialization script of the Form with a unique generated "id" for example "3451ce77-2736-437f-9584-f5a5255902c2". In this case, no client-side errors occur.

Expected/desired behavior

When deferring the component scripts to a file, the Form with specified editors must be initialized as expected without client-side errors.

Workaround

Use the TagHelper version of the Form or define the editor by using the EditorTemplateView() option:

        items.Add()
        .Field(f => f.City)
        .Label(l => l.Text("City"))
        .EditorTemplateView(Html.Partial("ComboEditor"));

// ~/Views/Shared/ComboEditor.cshtml

@model FormViewModel

@(Html.Kendo().ComboBoxFor(m => m.City)
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new List<SelectListItem>() {
	new SelectListItem() { Text = "City A", Value = "1" },
	new SelectListItem() { Text = "City B", Value = "2" },
	new SelectListItem() { Text = "City C", Value = "3" }
})
)

Environment

• **Telerik UI for ASP.NET Core version: 2024.4.1112
• **Browser: [ all ]