PopupEdit Template Events + DropDownList Cascade and Filtering

[Robert Madrian]

Hello,

I use a PopupEdit Template with cascading DropDownLists and in th second DropDownList a serverfilter (see code)

the problem is, that the template is loaded on grid load and the second DropDownList does'nt work because the value of the
field $("#Fachgruppe_Version_ID").val() in the template is not set at this time...

• how to solve this problem?
• I know that there is a onEdit event from the grid but how to call scripts in the template?
• what's the best way to use Javascript/JQuery in the template (View Components, partial views)?

robert

@(Html.Kendo().DropDownListFor(model => model.Fachgruppe_ID)
                                 .DataTextField("Fachgruppe")
                                 .DataValueField("Fachgruppe_ID")
                                 .BindTo((IEnumerable) ViewData["Fachgruppe"])
                                 .HtmlAttributes(new {style = "width:500px"})
                                 .CascadeFrom("Sparte_ID")
                                 )

                           @(Html.Kendo().DropDownList()
                                 .Name("FG")
                                 .HtmlAttributes(new {style = "width:100%"})
                                 .OptionLabel("Select product...")
                                 .DataTextField("Fachgruppe")
                                 .DataValueField("Fachgruppe_ID")
                                 .DataSource(source =>
                                 {
                                     source.Read(read =>
                                     {
                                         read.Action("FachgruppeVersion_Read", "Home")
                                             .Data("filterFachgruppe");
                                     })
                                         .ServerFiltering(true);
                                 })
                                 .Enable(true)
                                 .AutoBind(false)
                                 .CascadeFrom("Sparte_ID")
                                 )

                           <script>
                               function filterFachgruppe() {
                                   return {
                                       version_id: $("#Fachgruppe_Version_ID").val()
                                   };
                               }
                           </script>

[Danail Vasilev]

Hi Robert,

You should place the JavaScript code in the main view (e.g., where resides the grid). You can also find a fully runnable sample on this scenario here - grid-editing-cascading-dropdownlist

Regards,
Danail Vasilev
Telerik

[Robert Madrian]

might be another approach to place the Javascript code on the partial view and call the Javascript functions from the main view onEdit event?

[Danail Vasilev]

Hi Robert,

Your questions is not directly related to Kendo UI components but a general ASP.NET MVC knowledge. Nevertheless, you can find more information on the matter on the Internet, for example the following forum threads:
     - http://stackoverflow.com/questions/27410367/mvc-partial-view-javascript
     - http://stackoverflow.com/questions/30478252/call-javascript-from-within-an-asp-net-mvc-partial-view
     - http://stackoverflow.com/questions/11098198/is-it-ok-to-put-javascript-in-partial-views

Regards,
Danail Vasilev
Telerik