Переключение с POST на GET для jqGrid, заполненного с сервера WCF

Question

Я пытаюсь преобразовать мой клиентский ajax-вызов и jqGrid в использование GET вместо POST.

Я подтвердил, что сервис работает как задумано. Проверил в firebug и проверил объект ответа JSON, и это правильно - однако я все еще что-то упускаю на стороне клиента, потому что данные не заполняются в сетке. Никаких конкретных ошибок javascript в Firebug не обнаружено.

Один вопрос, который у меня возникает, это как подойти к параметрам url / data запроса .ajax () при использовании GET вместо POST. Мне действительно не нужно передавать какие-либо параметры через параметр data, если я могу просто передать параметры в URL с определенным UriTemplate, я думаю?

 function getData(pdata) {

    var jqGridArgs = {
        startDate: pdata.startDate(),
        endDate: pdata.endDate()
    };

    var _url = "Service.svc/Products?s=" + 
                 jqGridArgs.startDate + "&e=" + jqGridArgs.endDate;

    $.ajax(
            {
                type: "GET",
                contentType: "application/json; charset=utf-8",
                url: _url,

                //data: JSON.stringify({ args: jqGridArgs }), // do I need this for 'GET'?

                dataType: "json",
                success: function (data, textStatus) {
                    if (textStatus == "success") {
                        var thegrid = $("#jqGrid")[0];
                        thegrid.addJSONData(data.d);
                    }
                },
                error: function (data, textStatus) {
                    alert('An error has occured retrieving data.');
                }
            });
}

И код сетки:

var start = page.queryitem('s'); 
var end = page.queryitem('e'); 

var columnModel = [    
    { name: "ID", index: "ID", width: 175 },
    { name: "Name", index: "Name", width: 250 },
    { name: "Type", index: "Type", width: 250 }];

var columnNames = ['Product ID', 'Name', 'Type'];

$("#jqGrid").jqGrid({
        postData:
        {
           startDate: function () { return start; },
           endDate: function () { return end; },
        },
        datatype: function (pdata) {
            getData(pdata);          // calls the function above with 'postData'
        },
        colNames: columnNames,
        colModel: columnModel,
        rowNum: 10,
        rowList: [10, 20, 30],
        viewrecords: false,
        pagination: true,
        pager: "#jqPager",
        loadonce: true,
        sortorder: "desc",
        sortname: 'id',
        cellEdit: false
    });

А вот и внутренний метод WCF:

    [WebGet( UriTemplate = "Products?s={start}&e={end}",
                 ResponseFormat = WebMessageFormat.Json)]
    public JsonGridContract WebGetProducts(string start, string end)
    {
        DateTime _start = Convert.ToDateTime(start.ReplaceIf('T', ' ')); 
        DateTime _end = Convert.ToDateTime(end.ReplaceIf('T', ' '));

        var rows = GetProducts(_start, _end).Select(x => new
             {
                 ID = x.ID,
                 Name = x.Name,
                 Type = x.Type

             }).ToJson(); 

        return new JsonGridContract() { records = rows.Count, total = rows.Count, page = 1, rows = rows }; 
    }

Вот как данные инкапсулируются перед отправкой клиенту:

[DataContract]
public class JsonGridContract
{
    [DataContract]
    public class JsonRow
    {
        [DataMember]
        public int id { get; set; }

        [DataMember]
        public string[] cell { get; set; }

        public JsonRow(int length)
        {
            cell = new string[length];
        }
    }

    [DataMember]
    public int page { get; set; }

    [DataMember]
    public int total { get; set; }

    [DataMember]
    public int records { get; set; }

    [DataMember]
    public List<JsonRow> rows { get; set; }

    public JsonGridContract()
    {
        rows = new List<JsonRow>();
    }

    public JsonGridContract(List<JsonRow> _rows)
    {
        rows = _rows;
    }
}

Answer 1

Попробуйте это:

var jqGridArgs = {
    s: pdata.startDate(),
    e: pdata.endDate()
};

var _url = "Service.svc/Products";

$.ajax(
        {
            type: "GET",
            url: _url,
            data: jqGridArgs,
            dataType: "json",
            success: function (data) {
                var thegrid = $("#jqGrid")[0];
                thegrid.addJSONData(data.d);
            },
            error: function (data, textStatus) {
                alert('An error has occured retrieving data.');
            }
        });

Нет необходимости проверять успешность, если вызывается функция success, операция прошла успешно;

Это также делает более полезным использование вашего объекта javascript для передачи в качестве данных для получения. JQuery автоматически проанализирует его и использует для параметров запроса. Кроме того, поскольку это получение, а не публикация, нет необходимости в типе контента.

Answer 2

Оказывается, проблема в том, что при использовании GET нет члена data.d. Я не уверен почему.

Так меняется,

thegrid.addJSONData(data.d)

до

thegrid.addJSONData(data)

исправил проблему.