Пример использования jquery-плагина datatables с сервисом WCF

Question

Кто-нибудь знает о каких-либо примерах, использующих плагин jquery DataTables со службой WCF?

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

Мой javascript:

    $(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' равен нулю или не является объектом

Answer 1

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

Хитрость заключалась в том, чтобы использовать 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
                                        });
    }
}