2016-04-01 5 views
0

Ich habe ein KendoUI-Gitter, für das ich bin Daten aus einer WebAPI bin ich bin verbindlich, das Ergebnis an ein Kendo-Gitter zu binden.wie remote binden an eine Webapi mit Kendo ViewModel

<div class="grid"></div> 

Der Js-Code für Kendo zugrunde liegt, wie unten

/* 
    */ 
    var viewModel = kendo.observable({ 
     transport: { 
    read: { 
     url: 'http://199.63.72.194/FusionAPI/api/Site/GetSiteDetails?siteId=64909fee-e52e-4051-8277-8ba2101e743b', 
     dataType: "json", 
     contentType: 'application/json; charset=utf-8', 
     type: "GET", 
    } 
      schema: { 
       model: { 
        fields: { 
         sitename: { 
          type: "string" 
         }, 
         address: { 
          type: "string" 
         }, 
         contact: { 
          type: "string" 
         }, 
         status: { 
          type: "string" 
         } 
        } 
       }, 
       data: "siteMaster", 
      } 
     }), 
    }); 

    $("#grid").kendoGrid({ 
     dataSource: viewModel.dtSource, 
     height: 250, 
     columns: [ 
      { 
       field: "sitename", 
       title: "Site Name" 
      }, { 
       field: "address", 
       title: "Address" 
      }, { 
       field: "contact", 
       title: "Contact" 
      }, { 
       field: "status", 
       title: "Status" 
      } 
     ], 
     pageable: true, 
     sortable:true 
}); 

gezeigt Jedoch habe ich die Antwort von Postman bekommen, aber ich bin nicht in der Lage es an das Netz zu binden

Wo gehe ich falsch und was ist, dass ich vermisse

+0

Ihre URL http://199.63.72.194/FusionAPI/api/Site/GetSiteDetails?siteId=64909fee-e52e-4051-8277-8ba2101e743b nichts zurückkehr – Johncena365

+1

ich noch nie zuvor sehen: Die Verwendung 'kendo.observable' als DataSource. Kannst du keine Docs-Referenz darauf zeigen? Ich bin ziemlich sicher, dass, wenn Sie zu 'viewModel = new kendo.data.DataSource ({..' und im Grid 'dataSource: viewModel,' ändern, sollte es funktionieren. – DontVoteMeDown

+0

@ JohnCena365: Das ist ein interner Link. Es wird nicht Geben Sie nichts für Sie zurück Sie können es durch einen Link ersetzen, der JSON-Daten zurückgibt –

Antwort

0

Sie Syntax für die Datenquelle ist nicht korrekt.

Here is a link to the kendo documentation for a remote datasource using MVVM.

Here is a link to a grid example.

Grundsätzlich sollten Sie Ihre Syntax sein:

var viewModel = kendo.observable({ 
    products: new kendo.data.DataSource({ 
     transport: {.... 

Zusätzlich muss das Raster die Daten binden Attribute angeben. Zum Beispiel:

<div data-role="grid" 
    data-editable="true" 
    data-toolbar="['create', 'save']" 
    data-columns="[ 
      { 'field': 'ProductName', 'width': 270 }, 
      { 'field': 'UnitPrice' }, 
      ]" 
    data-bind="source: products, 
     visible: isVisible, 
     events: { 
      save: onSave 
     }" 
    style="height: 200px"></div> 
Verwandte Themen