We have this weird scenario where occasionally we get this, and a refresh and it may go away, its 99% not there and 1% of the time shows.

Happens in

Windows
DropDownList

Hi I'm attempting to repeat a vehicle (year/make/model) set of cascading dropdown lists in a component that would result in up to 3 vehicle selectors on the same form. Running into issues as the ddls have the same ids. I've been playing around with appending counters to the name etc but running into the issue where the last set of ddls gets the data. Wondering

1. If there is a working example of this scenario

2. If it is possible to pass a value to the filter function

Thanks.

I'm having an issue with a Grid component.  I have 2 custom editors for 2 small dropdown lists.  Anytime I select anything other than the default options for either (or both) dropdown lists, the default still gets assigned to the field for some reason.  I've tried debugging but it seems that it's getting changed before anything is sent to the controller (defaults are already present in the post action).

I set the custom editors up using the instructions here.

This is the component itself

@(
Html.Kendo().Grid<CHAASAddInsuredsViewModel>()
.Name("AddlInsureds")
.Columns(columns =>
{
columns.Bound(c => c.FirstName).Width(130);
columns.Bound(c => c.MiddleInitial).Width(70);
columns.Bound(c => c.LastName).Width(150);
columns.Bound(c => c.DOB).Format("{0:MM/dd/yyyy}").Width(150);
columns.Bound(c => c.RelationshipType)
.ClientTemplate("#=RelationshipType.RelationshipName#")
.EditorTemplateName("RelationshipTypeEditor").Width(140);
columns.Bound(c => c.Gender)
.ClientTemplate("#=Gender.GenderName#")
.EditorTemplateName("GenderEditor").Width(150);
columns.Bound(c => c.SSN).Width(160)
.HtmlAttributes(new { @class = "text-center" });
@* .EditorTemplateName("SSNEditorTemplate"); *@
@* .ClientTemplate("<h4>XXX-XX-XXXX</h4>"); *@
columns.Command(c => { c.Edit(); c.Destroy(); });
}
)
.ToolBar(toolbar => toolbar.Create().Text("Add Family Member"))
.Editable(editable => editable.Mode(GridEditMode.InLine)
.ConfirmDelete("Continue to delete this record?")
.DisplayDeleteConfirmation("Continue to delete this record?"))
.Sortable()
.Scrollable()
@* .HtmlAttributes(new { style = "height:550px;" }) *@
.DataSource(d => d
.Ajax()
.Model(m =>
{
m.Id(i => i.Id);
m.Field(f => f.RelationshipType)
.DefaultValue(ViewData["defaultRelationshipType"] as HNL_Agents.Models.AddlInsuredRelationshipType);
m.Field(f => f.Gender)
.DefaultValue(ViewData["defaultGender"] as HNL_Agents.Models.AddlInsuredGender);
})
.Events(e => e.Error("error_handler"))
.Create(c => c.Action("Insured_CreateUpdate", "CHAAS", new { modelAppId = Model.AppId }))
.Read(r => r.Action("GetInsureds", "CHAAS", new { modelAppId = Model.AppId}))
.Update(c => c.Action("Insured_CreateUpdate", "CHAAS", new { modelAppId = Model.AppId }))
.Destroy(d => d.Action("RemoveInsureds", "CHAAS"))
)
)

My model is as follows.

These are the custom editors for the drop down lists

@(
Html.Kendo().DropDownList()
.Name("RelationshipType")
.DataValueField("RelationshipId")
.DataTextField("RelationshipName")
.BindTo((System.Collections.IEnumerable)ViewData["relationshipTypes"])
)

Please let me know if there is anything I'm missing or if you need any more information.  Thanks for the help!

Controls loading icon stretching fields

As you can see fields grow and shrink due the the loading icon right of the dynamic controls being larger than the control I believe

Is this a bug or something I can do to resolve

https://i.imgur.com/puFkDGl.gif

I'm using a k-grid with an items per page dropdown, it initially loads correctly but when a new value is selected then the pager elements are hidden. 

I'm upgrading a project from 2021.2.511 to 2023.2.829 and I have a page which is extremely data heavy. Using the  .Size(ComponentSize.Small) option still results in a much larger drop-down list than before.

How can I reduce the size of these drop-downs further? In the old version, they simply inherited the font-size of the parent div.

This also applies to the multiselect controls as well

@model DetailSelectionViewModel

@(Html.Kendo().DropDownListFor(m => m)
        .DataValueField("Id")
        .DataTextField("Name")
        .Value(Model.Selected)
        .Events(e =>
        {
            e.Select("SelectionDropDownItemSelected");
            e.DataBound("SelectionDropDownDataBound");
        })
        .DataSource(dataSource => dataSource
            .Read(read => read.Action("GetDetailList", "DataWorksheet"))
        )
)

Above is the drop down that I have embedded within a detail grid.  When a value is changed in the master grid I need to traverse through all the detail rows and change the selected item in the dropdown list in each row.

So I successfully traverse the dataitems bound to the detailgrid. The dropdown appears to be changed until you actually click on the dropdown list and the dropdown appears with the selecteditem still being the item that was selected when the grid was originally rendered. When I click on the dropdown the Read Action occurs and the data is retrieved and the dropdown is bound, but the selected value isnt set to the new value desired.

Thinking that I can traverse the dataitems and set the values there. Think I need to traverse the datagrid itself and find the dropdown list in each row and programmatically choose the selected value.  I see no sample code to one traverse the datagrid that is a child when parent changed. I see no sample code to find the dropdown list in a datagrid row.

My logic starts when the datasource change event occurs for the parent grid.

Can anyone assist please. These tasks cant be that uncommon.

I am trying to create a kendo grid with one of the column as a multiselect dropdown widget, so users can select multiple values for a column named industry in a single record. I am not able to do so.

Please help.

This is how i have prepared my grid :

$("#ListofMF").kendoGrid({
            dataSource: {
                data: extractedData,
                schema: {
                    model: {
                        fields: {
                            Id: {type: "integer"},
                            FullName: { type: "string" },
                            Temp1: { type: "boolean" },
                            Temp2: { type: "boolean" },
                            Industry: { type: "string" },
                            //Discontinued: { type: "boolean" }
                        }
                    }
                },
                pageSize: 20
            },
            //scrollable: true,
            sortable: true,
            filterable: true,
            pageable: {
                input: true,
                numeric: true,
                pageSize: 6
            },
            columns: [
                {
                    title: " ",
                    width: 30,
                    field: "Id",
                    hidden: true
                },
                {
                    title: " ",
                    width: 40,
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="isMFSelected"/>'
                },
                {
                    field: "FullName",
                    title: "Data",
                    //width: "140px",
                    headerAttributes: { style: "font-weight: bold;" }
                },
                {
                    field: "Temp1",
                    title: "Temp 1",
                    width: "130px",
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="Temp1" #=Temp1? "checked=checked" : "" #/>'
                },
                {
                    field: "Temp2",
                    title: "Temp 2",
                    width: "130px",
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="Temp1" #=Temp1 ? "checked=checked" : "" #/>'
                },
                {
                    field: "Industry",
                    title: "Industry",
                    editor: function (container, options) {
                        // Get the industry template and apply it to the column editor
                        console.log(container.html);
                        var industryTemplate = $("#industryTemplate").html();
                        container.html(industryTemplate);
                    }
                }
            ]
        });

<script id="industryTemplate" type="text/x-kendo-template">
    @(Html.Kendo().MultiSelect()
        .Name("Industry")
        .DataValueField("Value")
        .DataTextField("Text")
        .BindTo((IEnumerable<SelectListItem>)ViewData["IndustryList"])
    )
</script>