2016-04-21 79 views
0

我正在嘗試顯示由此url可訪問的以下restful web api服務返回的數據表。問題是它只顯示錶格的標題而不是內容。無法顯示從asp中的ajax請求收到的數據表。 net web api

/智能/ API /建設/ GETALL

此URL將返回作爲輸出對象調用釋放一個IList,我已經測試了這一點。發佈對象的結構如下。

[Table("releases")] 
    public class Release 
    { 

     [Key] 
     public int Id { get; set; } 

     [StringLength(10)] 
     [Column("Name")] 
     public string Name { get; set; } 

     [StringLength(10)] 
     [Column("Type")] 
     public string Type { get; set; } 
     [Column("to_be_displayed")] 
     public bool ToBeDisplayed { get; set; } 

    } 

這裏是我的javascript代碼

$.ajax({ 
    type: 'GET', 
    url: '/SMART/api/Build/GetAll', 
    dataType: 'json', 
    contentType: "application/json", 
    success: function (data) { 
     alert(data); 
     // Get the JSON Data 
     var Data = new kendo.data.DataSource({ 

      schema: { 
       model: { 
        id: "release.id", 
        fields: { 
         id: { type: "string" }, 
         Name: { type: "string" }, 
         Type : {type : "string"}, 
         ToBeDisplayed: { type: "boolean" }, 


        } 
       } 
      } 
     }); 
     //Create a tab for the wip release 



     $('#listGrid').kendoGrid({ 
      scrollable: false, 
      sortable: true, 
      resizable: true, 
      filterable: true, 
      autoSync: true, 
      dataSource: Data, 
      columns: [ 
      { field: "release.id", title: "Id" }, 
      { field: "release.Name", title: "Name" }, 
      { field: "release.ToBeDisplayed", title: "To be displayed", template: "<input name='ToBeDisplayed' type='checkbox' data-bind='checked: ToBeDisplayed' #= ToBeDisplayed ? checked='checked' : '' # class='build-tobedisplayed-checkbox'/>" }, 

      ] 
     }); 
    } 
}); 

這裏是我的CSHTML代碼

<div id="listGrid" class="k-grid-content"> 
    <div class="k-loading-mask" style="width:100%;height:100%"><span class="k-loading-text">Loading...</span><div class="k-loading-image"><div class="k-loading-color"></div></div></div> 
</div> 
+0

我不是劍道UI專家,但它是明顯的,你的'data'變量從未被分配到任何東西。如果你沒有在你的'DataSource'中指定它,你怎麼能在你的網格中顯示它? –

回答

1

試試下面的代碼:

function definitionUserGrid() { 

var baseUrl = '/SMART/api/Build/GetAll'; 
var dataSource = new kendo.data.DataSource({ 
    transport: { 
     read: { 
      url: baseUrl, 
      dataType: "json" 
     }, 
     parameterMap: function (options, operation) { 
      if (operation !== "read" && options.models) { 
       return { 
        models: kendo.stringify(options.models) 
       }; 
      } 
     } 
    }, 
    batch: true, 
    pageSize: 15 
}); 

$("#listGrid").kendoGrid({ 
    dataSource: dataSource, 
    pageable: true, 
    reorderable: true, 
    resizable: true, 
    sortable: true, 
    filterable: { 
     mode: "row" 
    }, 
    columns: [ 
    {field: "Id", 
     title: "Id", 
    }, { 
     filterable: { 
      cell: { 
       enabled: true, 
       showOperators: false, 
       operator: "contains" 
      } 
     }, 
     field: "Name", 
     title: "Name" 
    }, { 
     filterable: { 
      cell: { 
       enabled: true, 
       showOperators: false, 
       operator: "contains" 
      } 
     }, 
     field: "ToBeDisplayed", 
     title: "To be displayed", 
     template: "<input name='ToBeDisplayed' type='checkbox' data-bind='checked: ToBeDisplayed' #= ToBeDisplayed ? checked='checked' : '' # class='build-tobedisplayed-checkbox'/>" }, 
    }] 
}); 

} 

最後:

通話功能definitionUserGrid()

$(function(){ 
    definitionUserGrid(); 
}); 
相關問題