Grid with Cascade Dropdowns issue

[Shafi]

Hi!

I'm attaching a small scale solution representing my own project that I have been working on and am facing an issue with a grid editor. After looking at numerous examples and Stack Overflow questions + this forum, I finally came to this setup. There is an issue in this implementation that I cannot trace out. upon making a selection in the Terminal Dropdown, an error occurs out of a dynamic script.

Secondly, one more thing that bothers me is that i need to NOT use AJAX calls for the basic IO on the list of objects. I believe it is possible to do it in memory with the datasource.data method. Still struggling with that.

In the end, once the user submits the form, I simply need to retrieve all added services from the BookedServices collection in the Save action of the Home controller. Can you please fix this for me?

[Shafi]

Just FYI: All Kendo Content and Scripts are removed. You'll need to paste them in manually from you own licensed version. I don't know if I need to do this before posting here.

[Shafi]

Can anyone please test the attached project in the first post so that we can get moving? Have been stuck on this for a few days now.

[Danail Vasilev]

Hi Shafi,

Generally, the editor templates have predefined prefixes and hence the binding expressions in this case are not the proper ones. You can try to remove the prefix of the editor template from the 
ParkingServiceDetailGrid.cshtml page:

ParkingServiceDetailGrid.cshtml

@using TelerikKendoMvc.GridWithCascadingDropdowns.ExampleProject.Models
@{ ViewData.TemplateInfo.HtmlFieldPrefix = ""; }
@model List<ParkingServiceDetailViewModel>

@(Html.Kendo().Grid<ParkingServiceDetailViewModel>()
    .Name("ServiceDetailGrid")
    .Columns(columns =>
...

Regarding submitting the grid with the other elements you can refer to this code library for an example - http://www.telerik.com/support/code-library/submit-form-containing-grid-along-with-other-input-elements

As for the datasource.data method it gets/sets the data of the datasource widget - http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-data

Regards,
Danail Vasilev
Telerik

[Shafi]

I see that the error is gone. But I notice that there is a series of weird characters being appended to the Ajax requests. See attached screen shot and the second dropdown is not getting filtered.

[Shafi]

Ok. I removed the

 

*.Type(HttpVerbs.Post)

 

from the API calls in the Grid helper's datasource and the child dropdown started to filter. Now, the issue is that after selection, the child dropdown reverts to selected value instead of display text. What's causing that? and also, the postback URLs are still containing lots of weird characters.

[Danail Vasilev]

Hi Shafi,

The special symbols in the query string are encoded square brackets used by the server filtering of the grid. You can make a test to disable the server filtering and see that they will disappear from the query string.

Regarding the selected dropdown text from the foreign key column this is so because the passed service data to the ViewBas is empty:

columns.ForeignKey(p => p.ServiceId, (System.Collections.IEnumerable)ViewBag.Services, "Code", "NameEnglish").Width(250).EditorTemplateName("ServiceId");

ViewBag.Services = new List<AirportService>();

You can try to pass the actual data. See an example in this sample - https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/grid-incell-editing-with-cascading-dropdownlist

Regards,
Danail Vasilev
Telerik

[Shafi]

The services I'm dealing with, if filtered to four terminals, results in around 25,050 records and growing. I cannot have that huge collection sitting around. And the requirement does makes sense. I tried to accomplish the same from pure client-side and am stuck at the same issue. Not only do I have a viewbag with 25K records, I have to add an API to get JSON from that ViewBag to be used for client side... another 25K and it doesn't work also as it is still reading and the page gets displayed.

[Danail Vasilev]

Hi Shafi,

It is required to pass all the data because the values in the foreign columns of the grid in non-edit mode should be matched to this data. 

Since, however, you have a great amount of data you can try to disable the default value binding for the ropdownlist in order to prevent initial binding when selected value is set. You can see such an approach in his example Grid editing using ComboBox with remote binding and filtering

Regards,
Danail Vasilev
Telerik

[Shafi]

I did some work on the data I was pulling and managed to trim it down A LOT. Things are calm now. From 25,000 to 125 records and I don't mind cluttering the views that JSON array twice even.