2010-09-23 1 views
2

Кто-нибудь знает какие-либо образцы, которые используют плагин jQuery с сервисом WCF?Пример использования datatables jquery plugin с WCF-сервисом

Я пытаюсь использовать службу WCF с JavaScriptSerializer, которая, к сожалению, кажется, возвращает изворотливый JSON, добавляя дополнительные обратные косые черты. Однако DataTables, казалось бы, обеспечит способ обойти это, учитывая, что извлечение JSON может быть передано вызову jQuery. Я не достаточно хорошо знаком с jQuery, чтобы заставить его работать.

Мой браузер:

$(document).ready(function() { 
     $('#example').dataTable({ 
      "bJQueryUI": true, 
      "bSort": true, 
      "bProcessing" : true, 
      "bServerSide" : true, 
      "bAutoWidth": true, 
      "sAjaxSource": "http://10.1.1.7/mvc-jqdatatable/datatabletestservice.svc/gettable", 
      "fnServerData": function(sSource, aoData, fnCallback) { 
       $.getJSON(sSource, aoData, function (json) { 
         fnCallback(json) 
       }) 
      }, 
     }); 
    }); 

Моя служба WCF будет выплевывать:

HTTP/1.1 200 OK 
Content-Length: 56 
Content-Type: application/json; charset=utf-8 
Server: Microsoft-IIS/7.5 
X-Powered-By: ASP.NET 
Date: Thu, 23 Sep 2010 12:37:24 GMT 

"{\"aaData\":[[\"a\",\"b\",\"c\"],[\"d\",\"e\",\"f\"]]}" 

Строка JSON становится сценарию DatatTables, но это не признается, как JSON и получаю сообщение об ошибке из:

'aaData.length' равно нулю или не является объектом

ответ

1

Закон Мерфи, как только я отправил вопрос, я нашел sample, который запустил меня и запустил.

Трюк в конечном итоге заключался в использовании jQuery разбора строки, возвращаемой службой WCF. Не делая этого, сценарий DataTables не может понять формат JSON, используемый WCF, поскольку он либо нестандартен, либо нажимает границы.

$(document).ready(function() { 
     $('#example').dataTable({ 
      "bJQueryUI": true, 
      "bSort": true, 
      "bProcessing" : true, 
      "bServerSide" : true, 
      "bAutoWidth": true, 
      "sAjaxSource": "http://10.1.1.7/mvc-jqdatatable/datatabletestservice.svc/gettable", 
      "fnServerData": function(sSource, aoData, fnCallback) { 
       $.ajax({ 
        "datatType" : 'json', 
        "contentType" : 'application/json', 
        "url" : sSource, 
        "data" : aoData, 
        "success" : function(msg) { 
        var json = $.parseJSON(msg); 
        fnCallback(json); 
        } 
       }) 
      }, 
     }); 
    }); 

Который работает с WCF службы:

public interface IDataTableTestService 
{ 
    [OperationContract] 
    [WebInvoke(ResponseFormat=WebMessageFormat.Json, BodyStyle=WebMessageBodyStyle.WrappedRequest, Method="GET")] 
    string GetTable(int iDisplayStart, 
     int iDisplayLength, 
     string sSearch, 
     bool bEscapeRegex, 
     int iColumns, 
     int iSortingCols, 
     int iSortCol_0, 
     string sSortDir_0, 
     int sEcho, 
     int webSiteId, 
     int categoryId); 
} 

public class DataTableTestService : IDataTableTestService 
{ 
    public string GetTable(int iDisplayStart, 
     int iDisplayLength, 
     string sSearch, 
     bool bEscapeRegex, 
     int iColumns, 
     int iSortingCols, 
     int iSortCol_0, 
     string sSortDir_0, 
     int sEcho, 
     int webSiteId, 
     int categoryId) 
    { 

     var result = new List<string[]>() { new string[]{"a", "b", "c"}, new string[]{"d", "e", "f"}}; 

     JavaScriptSerializer serialiser = new JavaScriptSerializer(); 
     return serialiser.Serialize(new { sEcho, 
              iTotalRecords = 2, 
              iTotalDisplayRecords = 2, 
              aaData = result 
             }); 
    } 
}