2016-12-08 14 views
0

クライアントがインライン編集とフィルタリングを希望しているので、MVCプロジェクトでjsGridを使用しようとしています。 しかし、JSONソースをテーブルに読み込むことができません。 テーブルをロードするための私のjsがそうのようになります。jsGridはJSONデータをレンダリングしません

$("#jsGrid").jsGrid({ 
      height: "50%", 
      width: "100%", 

      filtering: true, 
      inserting: true, 
      editing: true, 
      sorting: true, 
      paging: true, 
      autoload: true, 

      pageSize: 10, 
      pageButtonCount: 5, 

      deleteConfirm: "Do you really want to delete client?", 

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

       insertItem: function (item) { 
        return $.ajax({ 
         type: "CREATE", 
         url: "/api/RICInsrumentCodeTable", 
         data: item, 
         dataType: "json" 
        }); 
       }, 

       updateItem: function (item) { 
        return $.ajax({ 
         type: "UPDATE", 
         url: "/api/RICInsrumentCodeTable/" + item.ID, 
         data: item, 
         dataType: "json" 
        }); 
       }, 

       deleteItem: $.noop 

       //deleteItem: function (item) { 
       // return $.ajax({ 
       //  type: "DELETE", 
       //  url: "/api/data/" + item.ID, 
       //  dataType: "json" 
       // }); 
       //} 
      }, 

      fields: [ 
       { name: "Code", type: "text", title: "RIC Instrument Code", width: 150 }, 
       { name: "Descr", type: "text", title:"RIC Instrument Code Description", width: 200 }, 
       { name: "RICInstrumentGroupId", type: "select", title: "RIC Instrument Group", items: countries, valueField: "Id", textField: "Name" }, 
       { name: "Active", type: "checkbox", title: "Is Active", sorting: true }, 
       { type: "control" } 
      ] 
     }); 

    }); 

loaddataのは、私が働いていたものです。

とJSONのインクルードがGETデータから返されるが、そうのようになります。

[{"Id":1,"Code":"test1","Descr":"first code test","RICInstrumentGroupId":2,"Active":true},{"Id":2,"Code":"APP","Descr":"Apples and bananas","RICInstrumentGroupId":4,"Active":true},{"Id":3,"Code":"1","Descr":"1","RICInstrumentGroupId":1,"Active":true},{"Id":4,"Code":"3","Descr":"3","RICInstrumentGroupId":3,"Active":false}] 

これまでのところ、私はアヤックスが発射されていることを確認している、コールのそれと一致するように、私の配列のタイトルを変更し、リターンを確保有効なJSON内にある場合、他に何ができますか?

私の人生にとっては、なぜこれが機能していないのか分かりません。 ご協力いただければ幸いです。 ありがとうございました Jaidon Rymer

+0

どのコンソールエラー? – madalinivascu

+0

全くありません。修正するのが難しいのはどちらですか? – jjr2000

+0

はajaxトリガーですか? – madalinivascu

答えて

1

、テーブルの高さは、この表を引き起こしていた、何の高さがなかったdivの中で100%に設定された設定 ビット:私は問題

ここでのデモとなるようにボディが高さ0pxでレンダリングされ、heightプロパティが自動的に固定されるように変更されました。

アドバイスをいただきありがとうございます。

+0

ありがとうございます!私は正確な問題を抱えていた、狂っていた! – Francis

0

私はそれが必須かどうかわかりませんが、私はデモサンプル(ODataサービス)を見ています。 グリッドのloadData関数があなたと少し違って見えます。

loadData: function() { 
    var d = $.Deferred(); 

    $.ajax({ 
     url: "http://services.odata.org/V3/(S(3mnweai3qldmghnzfshavfok))/OData/OData.svc/Products", 
     dataType: "json" 
    }).done(function(response) { 
     d.resolve(response.value); 
    }); 

    return d.promise(); 
} 

は、ajax関数ではなく約束します。私は愚かされていたhttp://js-grid.com/demos/

関連する問題