каскадных kendoDropDownList, получить выделенный текст в первом раскрывающемся списке

Question

Я довольно новый для Кендо UI и получили основы для моего кода здесь: http://demos.telerik.com/kendo-ui/dropdownlist/cascadingdropdownlist

Я получил 2 API вызовов, где первые не принимают никаких параметров и возвращать список if items (Id, Name) Второй вызов api принимает идентификатор и возвращает список секунд (также просто объект с идентификатором и именем) Из этого я хочу иметь 2 каскадных выпадающих списка кендо. Однако моя проблема является вторым по URL всегда есть идентификатор быть нулевым или пустым, и я не могу понять, что это правильный синтаксис:

  // First dropdown, all good 
      var controllers = $("#Controller").kendoDropDownList({ 
       optionLabel: "Select controller...", 
       dataTextField: "Name", 
       dataValueField: "Id", 
       dataSource: { 
        serverFiltering: true, 
        transport: { 
         read: "/SharedData/GetControllers/" 
        } 
       } 
      }).data("kendoDropDownList"); 

      // second dropdown, always hit the api method with the id being null or empty (depending on syntax for url) 
      var actions = $("#Action").kendoDropDownList({ 
       autoBind: true, 
       cascadeFrom: "controllers", 
       cascadeFromField: "Id", 
       optionLabel: "Select Action...", 
       dataTextField: "Id", 
       dataValueField: "Name", 
       dataSource: { 
        serverFiltering: true, 
        transport: { 
         // HELP: need pass id to this route (which is id of selected controller) 
         read: "/SharedData/GetControllerActions/id=" + $("#Controller").data("kendoDropDownList").text() 
        } 
       } 
      }).data("kendoDropDownList"); 

Answer 1

Я считаю, что проблема в том, что ваш источник данные только получает набор один раза - во время инициализации - и в это время значение выпадающего списка равно нулю. Что я хотел бы сделать, это добавить событие изменения на первый раскрывающийся список, как это:

 var controllers = $("#Controller").kendoDropDownList({ 
      optionLabel: "Select controller...", 
      dataTextField: "Name", 
      dataValueField: "Id", 
      dataSource: { 
       serverFiltering: true, 
       transport: { 
        read: "/SharedData/GetControllers/" 
       } 
      }, 
      change: function(e) { 
       setSecondDS(); 
      } 
     }).data("kendoDropDownList"); 

     var setSecondDS = function() { 
      //initialize your new kendo datasource here 
      var dataSource = new kendo.data.DataSource({ 
       //your stuff here 
       transport: 
       serverFiltering: 
      }); 

      $("#Action").data("kendoDropDownList").setDataSource(dataSource); 
     }