Lasse Edsvik
Lasse Edsvik

Reputation: 9298

Kendo UI Dropdown update with parameter on button click

I'm trying to update a Kendo UI dropdownlist programmatically when pressing a button.

Main dropdown:

@(Html.Kendo().DropDownList()
          .Name(LayoutTemplate")
          .OptionLabel("Templates")
          .DataTextField("Text")
          .DataValueField("Value")
          .DataSource(source =>
          {
          source.Read(read =>
               {
                 read.Action("GetLayoutTemplatesDropdown", LayoutTemplate");
               });
           }))
           <button class="loadLayout" type="button">Load</button>

Second dropdownlist:

@(Html.Kendo().DropDownList()
        .Name("CreateTemplateCSS")
        .OptionLabel("Choose one")
        .DataTextField("Text")
        .DataValueField("Value")
        .Template("<span class=\"glyphicon glyphicon-font\"></span> #:data.Text#")
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("GetTemplateCSSTemplatesDropdown", "TemplateCSSTemplate")
                .Data("filterTemplateCSSTemplates"); 
            });
        })
        )

Javascript

    function filterTemplateCSSTemplates() {
        return {
            layoutTemplateID: $("#LayoutTemplate").val()
        };
    }

 $(".loadLayout").on("click", function (e) {

         var layoutTemplateID = $("#LayoutTemplate").val();

         if (layoutTemplateID) {   
              $("#CreateTemplateCSS").data("kendoDropDownList").refresh();
         }                    
    });

Goal is:

When $(".loadLayout") is clicked refresh "CreateTemplateCSS" with the "layoutTemplateID" parameter.

How can I adjust this to make it work?

Upvotes: 0

Views: 1818

Answers (1)

philr
philr

Reputation: 1940

If you're trying to refresh the datasource of your dropdownlist, you should do $("#CreateTemplateCSS").data("kendoDropDownList").dataSource.read();

If you're trying to change the datasource completely then in your click function you should create a new datasource then update your dropdownlist in javascript using

    $("#CreateTemplateCSS").kendoDropDownList({
        dataTextField: "Text",
        dataValueField: "Value",
        valuePrimitive: true,
        optionLabel: "Templates",
        value: layoutTemplateID,
        dataSource: {
            data: yourDataSource
        }
    });

Upvotes: 1

Related Questions