Html.Kendo().Grid<XXXX.WebUI.Models.Employees.LocationsListViewModel>()
    .Name("EmployeeLocationsGrid")
    .Columns(columns => {
        columns.Select().Width(45);
        columns.Bound(c => c.UIDEmployee).Visible(false);
        columns.Bound(c => c.UIDEmployee_Location).Title("Id").Width(50);
        if (Model.LocationsEntities != null)
        {
            columns.ForeignKey(f => f.UIDLocation, Model.LocationsEntities?.Items, "UIDEntity", "Name")
                .Title("Location")
                .EditorTemplateName("FieldListLocations")
                .EditorViewData(new { locations = Model.LocationsEntities.Items })
                .Width(200);
        }
        if (Model.LocationsEntities != null)
        {
            columns.ForeignKey(f => f.UIDSublocation, Model.SublocationsEntities?.Items, "UIDEntity", "Name")
                    .Title("Sublocation")
                    .EditorTemplateName("FieldListSublocations")
                    .EditorViewData(new { sublocations = Model.SublocationsEntities.Items })
                    .Width(200);
        }
        columns.Bound(c => c.Main)
            .Title("Main")
            .EditorTemplateName("FieldCheckBox")
            .ClientTemplate("#= Main ? 'Yes' : 'No' #")
            .Width(100);
        columns.Bound(c => c.PercentageOfDedication)
            .Title("% Dedication")
            .EditorTemplateName("FieldNumericTextBox")
            .Format("{0} %")
            .Width(200);
        columns.Bound(c => c.StartDate)
            .Title("Start Date")
            .ClientTemplate("#= kendo.toString(kendo.parseDate(StartDate), 'dd/MM/yyyy') #")
            .EditorTemplateName("FieldDateOnlyPicker")
            .Width(200);
        columns.Bound(c => c.EndDate)
            .Title("End Date")
            .ClientTemplate("#= EndDate != null ? kendo.toString(kendo.parseDate(EndDate), 'dd/MM/yyyy') : '<strong>Currently</strong>' #")
            .EditorTemplateName("FieldDateOnlyPicker")
            .Width(200);
        columns.Bound(c => c.Comments)
            .Title("Comments")
            .EditorTemplateName("FieldTextArea")
            .Width(250);
        columns.Command(command => {
            command.Edit().Text(" ").UpdateText(" ").CancelText(" ").IconClass("bi bi-pencil-square").HtmlAttributes(new { @class = "btn btn-outline-primary", title = "Edit" });
            command.Custom("deleteLocation")
                .Click("function(e) { var dataItemLoc = this.dataItem($(e.target).closest('tr')); window.i3.OnDeleteEmployeeLocation(dataItemLoc); }")
                .Text(" ").IconClass("bi bi-trash3")
                .HtmlAttributes(new { @class = "btn btn-outline-primary", title = "Delete" });
        }).Title("Actions");
    })
    .NoRecords(s => s.Template("<span class='ms-3 mt-3'><i class='bi bi-people-fill me-2'></i><strong>This employee was not assigned to any location.</strong></span>"))
    .AutoBind(true)
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Sortable(sorting => sorting.Enabled(true))
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple).DragToSelect(false))
    .Events(events => events
        .Sort("window.i3.OnColumnSorted").Save("window.i3.OnSaveLocation")
    )
    .DataSource(ds => ds
        .Ajax()
        .Model(gridModel =>
        {
            gridModel.Id(entity => entity.UIDEmployee_Location);
            gridModel.Field(p => p.UIDEmployee_Location).Editable(false);
            gridModel.Field(p => p.UIDEmployee).Editable(false).DefaultValue(Model.UIDEmployee);
            gridModel.Field(p => p.UIDLocation).Editable(true);
            gridModel.Field(p => p.UIDSublocation).Editable(true);
            gridModel.Field(p => p.UIDStatus).Editable(false);
            gridModel.Field(p => p.UIDPosition).Editable(false);
        })
        .Read(r => r.Action("GetAllEmployeeLocations", "Employees", new { EmployeeID = Model.UIDEmployee }))
        .Events(events => events
            .RequestEnd("window.i3.OnRequestEndLocation")
        )
        .PageSize(10)
    )
)

public OnSaveLocation(e: kendo.ui.GridSaveEvent): void {
    e.preventDefault();

    const gridLocation = $("#EmployeeLocationsGrid").data("kendoGrid");
    const locationsItems: LocationsListViewModel[] = (gridLocation?.dataSource.data() as unknown) as LocationsListViewModel[];
    let newLocItem: LocationsListViewModel = (e.model as any) as LocationsListViewModel;

    // Fix Date
    let startLocationDateNew = new Date(newLocItem.StartDate);
    let endLocationDateNew = new Date(newLocItem.EndDate);
    let offsetLocationNew = startLocationDateNew.getTimezoneOffset();
    startLocationDateNew = new Date(startLocationDateNew.getTime() - (offsetLocationNew * 60 * 1000));
    endLocationDateNew = new Date(endLocationDateNew.getTime() - (offsetLocationNew * 60 * 1000));

    let newLocationItem: LocationsListViewModel = {
        UIDEmployee_Location: newLocItem.UIDEmployee_Location,
        UIDEmployee: newLocItem.UIDEmployee,
        UIDLocation: newLocItem.UIDLocation,
        UIDSublocation: newLocItem.UIDSublocation,
        UIDPosition: newLocItem.UIDPosition,
        Main: newLocItem.Main,
        PercentageOfDedication: newLocItem.PercentageOfDedication,
        StartDate: startLocationDateNew.toISOString().split('T')[0],
        EndDate: endLocationDateNew.toISOString().split('T')[0],
        UIDStatus: newLocItem.UIDStatus,
        Comments: newLocItem.Comments
    };
}

@using XXXX.Application.Application.Maintenances.DTOs;

@model int?

@(Html.Kendo().DropDownListFor(m => m)
    .DataTextField("Name")
    .DataValueField("UIDEntity")
    .OptionLabel("Select...")
    .BindTo((IEnumerable<GenericMaintenanceEntityDTO>)ViewData["sublocations"]!)
)

@using XXXX.Application.Application.Maintenances.DTOs;

@model int

@(Html.Kendo().DropDownListFor(m => m)
    .DataTextField("Name")
    .DataValueField("UIDEntity")
    .OptionLabel("Select...")
    .BindTo((IEnumerable<GenericMaintenanceEntityDTO>)ViewData["locations"]!)
)

interface LocationsListViewModel {
    UIDEmployee_Location: number;
    UIDEmployee: number;
    UIDLocation: number;
    UIDSublocation: number;
    UIDPosition: number;
    Main: boolean;
    PercentageOfDedication: string;
    StartDate: string;
    EndDate: string;
    UIDStatus: number;
    Comments: string;
}

    function submitAddressImport() {
         var grid = $("#groupAddressesImportGrid").data('kendoGrid');
         var selectedItems = grid.selectedKeyNames();
         var actualItems = [];

         if (selectedItems.length > 0) {
           selectedItems.forEach(function(key) {
            actualItems.push(grid.dataSource.get(key));
           });
         }

        kendo.ui.progress($("#groupAddressesImportGrid"), true);
        for (var i = 0; i < actualItems.length; i++) {
                $.ajax({
                type: "POST",
                url: "@Url.Action("AddAddress", "Address")",
                contentType: "application/json;",
                data: actualItems[i],  // JSON.stringify(actualItems[i]) avoids console error
                traditional: false,
                success: function (data) {
                 ...
                },
                error: function (data) {
                  ...
                },
                timeout: function (data) {
                   ...
                }, complete: function () {
                   ...
                }
            });
        }
        closeGroupAddresspopup()
    }

            @(
                Html.Kendo().Grid(Model.groupAddresses)
                .Name("groupAddressesImportGrid")
                .HtmlAttributes(new { @class = "table-cell" })
                .Columns(columns =>
                {
                    columns.Select().Width(50);
                    columns.Bound(obj => obj.AddressType).Title("Type").Width(60);
                    columns.Bound(obj => obj.PrimaryField).Title("Primary");
                    columns.Bound(obj => obj.Address1).Title("Address");
                    columns.Bound(obj => obj.AddressCity).Title("City");
                    columns.Bound(obj => obj.State).Title("State");
                    columns.Bound(obj => obj.ZipCode).Title("Zip Code");
                    columns.Bound(obj => obj.County).Title("County");
                })
                .Sortable(_ => _.AllowUnsort(true))
                .Resizable(resizable => resizable.Columns(true))
                .Navigatable()
                .Filterable()
                .Scrollable()
                .Resizable(resize => resize.Columns(true))
                .Events(ev=>ev.Change("handleCheckBox"))
                .PersistSelection()
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Model(model => model.Id(p => p.AddressId)) 
                )
                )

public record SettingsViewModel
{
    [DataType(DataType.Password)]
    public string Password { get; set; } = null!;
}

<script id="settings-template" type="text/x-kendo-template">
    @(Html.Kendo().Form<settingsViewModel>()
        .Name("settingsForm")
        .FormData(Model.Settings)
        .Layout("grid")
        .Grid(g => g.Cols(2).Gutter(5))
        .HtmlAttributes(new { method = "POST", style = "width: 100%;" })
        .Validatable(v =>
        {
            v.ValidateOnBlur(false);
            v.ValidationSummary(true);
        })
        .Items(items =>
        {
                
            items.Add().Field(f => f.Password).Label("Password");
        })
        .ToClientTemplate()
        @* .ToString()
        .Replace("#", "\\#") *@
    )
</script>

<div class="k-d-flex-col k-justify-content-center">
    @(Html.Kendo().TileLayout()
        .Name("settings")
        .Columns(5)
        .RowsHeight("auto")
        .Containers(c =>
        {
            ...
            c.Add().BodyTemplateId("settings-template").ColSpan(4).RowSpan(1);
            ...
        })
    )
</div>

Uncaught Error: Invalid template:'
        <form id="settingsForm" method="POST" name="settingsForm" style="width: 100%;"></form><script>kendo.syncReady(function(){jQuery("\#settingsForm").kendoForm({"validatable":{"validateOnBlur":false,"validationSummary":{}},"formData":{"Password":"bla#bla","Id":0},"layout":"grid","grid":{"cols":2,"gutter":5},"serverErrors":{},"items":[{"field":"Password","label":{"text":"Password"},"editorOptions":{},"validation":{"data-val":"true","data-val-required":"The Password field is required.","type":"password"},"shouldRenderHidden":true}]});});<\/script>
    ' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='\n        <form id="settingsForm" method="POST" name="settingsForm" style="width: 100%;"></form><script>kendo.syncReady(function(){jQuery("#settingsForm").kendoForm({"validatable":{"validateOnBlur":false,"validationSummary":{}},"formData":{"Password":"bla';bla","Id":0},"layout":"grid","grid":{"cols":2,"gutter":5},"serverErrors":{},"items":[{"field":"Password","label":{"text":"Password"},"editorOptions":{},"validation":{"data-val":"true","data-val-required":"The Password field is required.","type":"password"},"shouldRenderHidden":true}]});});<\/script>
    ;$kendoOutput+=;}return $kendoOutput;'
    at Object.compile (kendo.all.js:322401:19)
    at init._initContainers (kendo.all.js:322401:19)
    at new init (kendo.all.js:322401:19)
    at HTMLDivElement.<anonymous> (kendo.all.js:322401:19)
    at Function.each (jquery.min.js:2:2898)
    at n.fn.init.each (jquery.min.js:2:846)
    at e.fn.<computed> [as kendoTileLayout] (kendo.all.js:322401:19)
    .......