jsGridを使用して項目をドロップダウンリストに追加する方法は？

Question

これはjsGridによって構築されたグリッドの前に表示するアプリケーション側の詳細を取得するサンプルプロジェクトのjQueryコードです。

$("#part_table").jsGrid({ 
      height: "auto", 
      width: "100%", 
      autoload: true, 
      editing: true, 
      sorting: true, 
      paging: true, 
      pageSize: 10, 
      inserting: true, 
      loadIndication: false, 
      filtering: true, 
      headerRowClass: 'table-green-header', 
      controller: { 
       loadData: function (filter) { 
        function..... 
       }, 
       updateItem: function (item) { 

        function..... 

       } 
      }, 
      fields: [ 
       { name: "Id", type: "number", visible: false }, 
       { 
        name: "CatalogueId", type: "select", **items**: catalouges, valueField: "Id", textField: "CatalougeName", selectedIndex : -1 , title: "Catalouge Name", align: "center" 
       }, 

       { name: "DistributorPrice", type: "number", title: "Distributor Price", align: "center", filtering: false, sorting: false }, 
       { name: "IsActive", type: "checkbox", filtering: false, sorting: false }, 
       { type: "control" } 


      ], 
      rowClick: function (args) { 
       return false; 
      }, 
     }); 

誰でも、AJAXコール経由でアプリケーション側に電話することで項目のリストを取得する方法を言うことができますか？

おかげ

Answer 1

あなたは、コントローラのloaddataのでAJAX呼び出し..ような何か書く：

controller: { 
       loadData: function(filter) { 
        return $.ajax({ 
         type: "GET", 
         url: "/api/data", 
         data: filter, 
         dataType: "json" 
        }); 
}      
} 

さらに、事前にhttps://github.com/tabalinas/jsgrid-webapi

Answer 2

負荷項目を参照して、グリッドフィールドで結果を使用しますconfig：例：

$.ajax({ 
    type: "GET", 
    url: "/countries/" 
}).done(function(countries) { 

    countries.unshift({ id: "0", name: "" }); 

    $("#jsGrid").jsGrid({ 
     ..., 
     fields: [ 
      ... 
      { name: "country_id", title: "Country", type: "select", width: 100, items: countries, valueField: "id", textField: "name" } 
     ] 
    }); 

}); 

jsgrid sample project