2013-04-26 2 views
0

Я пытаюсь получить простую веб-службу/тестовую страницу, работающую с использованием сетки пользовательского интерфейса Kendo. Мой веб-сервис не возвращает строку данных JSON:Kendo UI grid - не заполняется данными JSON

[{"ord_number":"116347  ","ord_company":"HERHER12","origin_cmp_id":"HERHER02","origin_cmp_name":"HERSHEY-WEST PLANT","dest_cmp_id":"EDCPAL","dest_cmp_name":"EDC III BUILDING 1918","orderby_cmp_id":"HERHER12","orderby_cmp_name":"HERSHEY","orderby_cty_nmstct":"Hershey,PA/","billto_cmp_id":"HERHER12","billto_cmp_name":"HERSHEY","billto_cty_nmstct":"Hershey,PA/","ord_status_name":"Completed"},{"ord_number":"116348  ","ord_company":"HERHER12","origin_cmp_id":"HERHER02","origin_cmp_name":"HERSHEY-WEST PLANT","dest_cmp_id":"EDCPAL","dest_cmp_name":"EDC III BUILDING 1918","orderby_cmp_id":"HERHER12","orderby_cmp_name":"HERSHEY","orderby_cty_nmstct":"Hershey,PA/","billto_cmp_id":"HERHER12","billto_cmp_name":"HERSHEY","billto_cty_nmstct":"Hershey,PA/","ord_status_name":"Completed"}] 

Более точно, вот что получает от вызова веб-службы

<?xml version="1.0" encoding="utf-8"?> 
<string xmlns="http://tempuri.org/">[{"ord_number":"116347  ","ord_company":"HERHER12","origin_cmp_id":"HERHER02","origin_cmp_name":"HERSHEY-WEST PLANT","dest_cmp_id":"EDCPAL","dest_cmp_name":"EDC III BUILDING 1918","orderby_cmp_id":"HERHER12","orderby_cmp_name":"HERSHEY","orderby_cty_nmstct":"Hershey,PA/","billto_cmp_id":"HERHER12","billto_cmp_name":"HERSHEY","billto_cty_nmstct":"Hershey,PA/","ord_status_name":"Completed"},{"ord_number":"116348  ","ord_company":"HERHER12","origin_cmp_id":"HERHER02","origin_cmp_name":"HERSHEY-WEST PLANT","dest_cmp_id":"EDCPAL","dest_cmp_name":"EDC III BUILDING 1918","orderby_cmp_id":"HERHER12","orderby_cmp_name":"HERSHEY","orderby_cty_nmstct":"Hershey,PA/","billto_cmp_id":"HERHER12","billto_cmp_name":"HERSHEY","billto_cty_nmstct":"Hershey,PA/","ord_status_name":"Completed"}]</string> 
(это веб-сервис ASP.NET ничего фантазии.)

Вот содержимое страницы ASP.NET, я надеялся бы заполнить данные:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="KendoUI.aspx.cs" Inherits="KendoUI" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="styles/kendo.common.min.css" rel="stylesheet" /> 
    <link href="styles/kendo.default.min.css" rel="stylesheet" /> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/kendo.web.min.js"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div id="example" class="k-content"> 
      <div id="grid"></div> 
      <script> 
       $(document).ready(function() { 

       dataSource = new kendo.data.DataSource({ 
        transport: { 
         read: { 
          type: "POST", 
          url: "http://localhost/GridTest/Services/WebService.asmx/GetLegsJSON", 
          dataType: "json" 
         } 
        }, 
        schema: { 
         model: { 
          id: "ord_number", 
          fields: { 
           ord_number: { type: "string"}, 
           ord_company: { type: "string" }, 
           origin_cmp_id: { type: "string" }, 
           origin_cmp_name: { type: "string" }, 
           dest_cmp_id: { type: "string" }, 
           dest_cmp_name: { type: "string" }, 
           orderby_cmp_id: { type: "string" }, 
           orderby_cmp_name: { type: "string" }, 
           orderby_cty_nmstct: { type: "string" }, 
           billto_cmp_id: { type: "string" }, 
           billto_cmp_name: { type: "string" }, 
           billto_cty_nmstct: { type: "string" }, 
           ord_status_name: { type: "string" } 
          } 
         } 
        }, 
        pageSize: 10, 
        type: "json" 
       }); 

       $("#grid").kendoGrid({ 
        autobind: false, 
        dataSource: dataSource, 
        pageable: true, 
        columns: [ 
         { title: "Order #", field: "ord_number" }, 
         { title: "Company", field: "ord_company" }, 
         { title: "Origin ID", field: "origin_cmp_id" }, 
         { title: "Origin CN", field: "origin_cmp_name" }, 
         { title: "Dest ID", field: "dest_cmp_id" }, 
         { title: "Dest CN", field: "dest_cmp_name" }, 
         { title: "Order By ID", field: "orderby_cmp_id" }, 
         { title: "Order By CN", field: "orderby_cmp_name" }, 
         { title: "Order By C/S", field: "orderby_cty_nmstct" }, 
         { title: "BillTo ID", field: "billto_cmp_id" }, 
         { title: "BillTo CN", field: "billto_cmp_name" }, 
         { title: "BillTo C/S", field: "billto_cty_nmstct" }, 
         { title: "Status", field: "ord_status_name" } 
        ] 
        }); 
       }); 
      </script> 
     </div> 
    </form> 
</body> 
</html> 

но ничего не заполнит, кроме заголовков в таблице с «нет элементов для отображения» в сноске.

Для жизни меня я не вижу, что я делаю неправильно.

+0

Кажется правильно! Что вы получаете, когда открываете http: //localhost/GridTest/Services/WebService.asmx/GetLegsJSON в своем браузере? JSON, который вы включили? – OnaBai

+0

Я получаю XML, который я включил. Хотя мой метод украшен этим атрибутом: [ScriptMethod (ResponseFormat = ResponseFormat.Json, UseHttpGet = true)] –

+0

Для ясности мой метод веб-службы возвращает строку. Я использую класс JavaScriptSerializer для сериализации общего списка объектов. Когда я проверяю значение возвращаемого типа в отладчике, оно НЕ завернуто в XML. Веб-сервис, кажется, завершает его в XML, и я не могу понять, как сказать, чтобы не делать этого. –

ответ

2

Ваш веб-сервис не возвращает JSON. Он возвращает XML. Вы должны вернуть JSON вместо XML. Я рекомендую проверить следующее сообщение в блоге: http://encosia.com/using-jquery-to-consume-aspnet-json-web-services/

Также здесь есть веб-сайт образца, который показывает, как связать Кендо сетки на службу ASMX: https://github.com/telerik/kendo-examples-asp-net/tree/master/grid-web-service-crud

1

Тот факт, что вы получите XML при просмотре WebService.asmx не о чем беспокоиться. Это стандартная конфигурация, если вы не подделали ваш web.config (или machine.config). Попробуйте использовать $ .ajax(), чтобы использовать эту службу и подтвердить, что результатом является JSON, так как это будет делать DataSource. Проблема возникает в случае POST против GET и при использовании автоматической генерации страницы, предоставляемой .asmx, доступ к службе осуществляется по-разному и с разными заголовками, чем с $ .ajax()

Также прекратите использование JavaScriptSerializer для ваших результатов. Создайте класс, представляющий вашу модель данных, и установите ваш webMethod для возврата в качестве этого класса, а затем в метод, постройте объект, используя этот класс, и верните этот объект. WebService автоматически проанализирует и вернет JSON на основе ваших подсказок ScriptMethod. Большая статья объясняя это слишком распространенной ошибкой является http://encosia.com/asp-net-web-services-mistake-manual-json-serialization/

0

Попробуйте добавить contentType свойству

read: { 
    ... 
    contentType: "application/json; charset=utf-8" 
} 
Смежные вопросы