I have a .NET MVC app where I'm using Kendo grid. I have a form that a user can fill out and save it as a draft, then come back later and finish it. When I go to edit the form I saved as a draft, I want all of the combo boxes (including cascading ones) to auto-fill with the previously selected values. I'm able to do this fine with non-cascading combo boxes, and somewhat with cascading combo boxes, but the problem I'm having is that the displayed value in my cascading combo box is the value (an int ID) when I want it to display the text value (a string).
@(Html.Kendo().ComboBox()
.Name("ChildId") // Matches the column name
.DataTextField("Text")
.DataValueField("Value")
.CascadeFrom("ParentId") // Cascades based on ParentId
.CascadeOnPageLoadIfThereBeAValueInTheOtherCombo() // I'm looking for something like this
.DataSource(source => source
.Read(read => read.Action("GetChildData", "Home"))
)
.OptionLabel("Select Child")
)
I understand that the data does not get pulled into the cascading combo box normally until a selection is made from the dropdown box it cascades from, and if I'm just basing the Kendo combobox on an ID attribute it won't know what text to display without getting the list items, but in this case a selection was already made previously so I want it to get that data immediately (on page load). Is there a way I can do it in JavaScript or call some Kendo method in C# that tells it to populate with the data immediately without waiting for the initial user interaction?
If I can at a minimum set the display text to what I want then that might be enough.
I tried a lot of things that didn't work, but arrived at this solution that's pretty simple. I added a property DropdownIndex
to my model, and in my C# code where I'm getting the view model to return, I set the value to the index of the item that should be selected.
int myIndex = 2;
MyModel.DropdownIndex = myIndex;
Then in the .cshtml with Kendo grid I added the .SelectedIndex()
Kendo method, passing in the value from the model
.SelectedIndex(Model.DropdownIndex)
Everything is working as expected now.