エディタ関数を使用したKendogridカスケーディングDropdownList

Question

剣道グリッドエディタ関数を使用して、ポップアップ（編集フォーム）の国番号&のカスケードDropDownListを実装しています。しかし、私はそれを行うことができません（リストは両方とも首尾よく埋められますが、カスケードされません。ユーザーがCountryオプションを選択したときと同様に、選択された国オプションに基づいて州リストが設定されます）。私を助けてください。私はTelerik Webサイトから多くのソリューションを試しましたが、DataSourceとしてOdataを使用しています。データベースからデータを取得しています。

 public JsonResult Details() 
     { 

    var country = dbforcountry.Countries.ToLoist(); 
    list<SelectListItems> licountry = new list<SelectListItems>(); 
    foreach (var i in country) 
    { 
    licountry .Add(new list<SelectListItems> {Text = u.Name, Value = 
    u.ID.ToString() }); 
    } 

    return Json(new SelectList(licountry, "Value", "Text",   
    JsonRequestBehaviour.AllowGet)) 

    } 

    public JsonResult getstates(int id) 
    { 

     var states= dbforcountry.States.ToLoist(); 
     list<SelectListItems> listates = new list<SelectListItems>(); 
     foreach (var i in states) 
     { 
     listates.Add(new list<SelectListItems> {Text = u.Name, Value = 
     u.ID.ToString() }); 
     } 

     return Json(new SelectList(listates, "Value", "Text", 
     JsonRequestBehaviour.AllowGet)) 

     } 

エディタ機能（表示）：

 function CountryDropDown(container, options) 
     { 
     $('<input id="Countrydropdown" data-text-field="Text" data-value- 
     field="Value" data-bind="value:'+options.field+'" />') 
     .appendTo(container) 
     .kendDropDownList({ 

     autoBind: false, 
     dataTextField="Text", 
     dataValueField="Value", 
     dataSource: { 
     type: "json", 
     transport:{ 
     read:{ 
      url: "../mycontroller/Details", 
      method:"POST" 
      } 
      } 
      }, 
      }) 
      } 

     function StateDropDown(container, options) 
     { 
     $('<input id="Statedropdown" data-text-field="Text" data-value- 
     field="Value" data-bind="value:'+options.field+'" />') 
     .appendTo(container) 
     .kendDropDownList({ 

     autoBind: false, 
     dataTextField="Text", 
     dataValueField="Value", 
     dataSource: { 
     type: "json", 
     transport:{ 
     read:{ 
      url: "../mycontroller/getstates", 
      method:"POST" 
      } 
      } 
      }, 
      }) 
      } 
      } 

      }) 
      } 

Answer 1

あなたはStateDropDownにcascadeFromタグが欠落している

は、ここに私のコード

コントローラです。

$('<input id="Statedropdown" data-text-field="Text" data-value- 
    field="Value" data-bind="value:'+options.field+'" />') 
    .appendTo(container) 
    .kendDropDownList({ 
     autoBind: false, 
     cascadeFrom: "Countrydropdown", 
     dataTextField="Text", 
     dataValueField="Value", 
     dataSource: { 
      type: "json", 
       transport:{ 
        read:{ 
         url: "../mycontroller/getstates", 
         method:"POST" 
        } 
      } 
     }, 
    }); 

注：あなたは（おそらくグリッドコントロールを通じて）、編集者を通じてドロップダウンをカスケード接続している場合は、どのようcascade drop downs within a gridの例を見つけることができます。

EDIT

Telerik液（すなわち都市の選択がドロップダウンの状態で使用可能な項目を駆動するドロップダウン）、2回のドロップダウンをチェーンのための別の解決策は実現可能ではない場合は、トリガchangeイベントを利用することができます都市からのアイテムの選択時にドロップダウンします。初期化時に

無効にStateDropDownをし、提供dataSource空：

$('<input id="Statedropdown" data-text-field="Text" data-value- 
    field="Value" data-bind="value:'+options.field+'" />') 
    .appendTo(container) 
    .kendDropDownList({ 
     enable: false, 
     autoBind: true, 
     cascadeFrom: "Countrydropdown", 
     dataTextField="Text", 
     dataValueField="Value", 
     dataSource: []    
    }); 

お使いのコントローラ機能にAJAX呼び出しを使用しますCountryDropDownからchangeイベント（getstates）として選択した国のidを提供するフックアップパラメータ：

$('<input id="Countrydropdown" data-text-field="Text" data-value- 
    field="Value" data-bind="value:'+options.field+'" />') 
     .appendTo(container) 
      .kendDropDownList({ 
      autoBind: false, 
      dataTextField="Text", 
      dataValueField="Value", 
      dataSource: { 
       type: "json", 
       transport:{ 
        read:{ 
         url: "../mycontroller/Details", 
         method:"POST" 
        } 
       } 
      }, 
      change: function(e) { 
       // extract item selected 
       var item = this.dataItem(); 

       $.ajax({ 
        type: "POST", 
        url: "/yourController/getstates",   
        data: JSON.stringify(item.ID), // ID of country selected 
        dataType: "json", 
        contentType: "application/json", 
        async: true, 
        success: function (response) { // response will contain listates returned from controller 
         var stateDropDown = $("#Statedropdown").data("kendoDropDownList")'; 
         // changed to use another approach to set dataSource       
         var dataSource = new kendo.data.DataSource({ 
          data: response 
         }); 
         stateDropDown.setDataSource(dataSource); 
        } 
       }); 
      } 
     }); 

コードがテストされていないため、にいくつかの調整が必要な場合があります10コール/ドロップダウンがグリッド内で使用されている場合（それがまだあるかどうかわからない）、stateDropDownをcountryDropDownに最も近づける必要があるかもしれませんが、これは正しい軌道に乗るはずです。

EDIT

はsetDataSource機能を使用するためにAJAX呼び出しでsuccess方法を変更しました。剣道のドロップダウンに割り当てる前にresponseを使用してdataSourceを構築する必要があることに注意してください。