Question

我正在尝试将我的客户端ajax-call和jqGrid转换为使用GET而不是POST。

我已确认该服务按预期工作。检查了firebug并检查了JSON响应对象并且它是正确的 - 但是我仍然在客户端丢失了一些东西，因为数据没有填充到网格中。没有具体的javascript错误出现在firebug中。

我遇到的一个问题是在使用GET而不是POST时如何处理.ajax（）请求的url / data参数。如果我可以通过特定的UriTemplate传递URL中的参数，我真的不需要通过data参数传递任何参数吗？

 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对象作为get的数据传递后，它还有更多功能。 JQuery将自动解析它并将其用于查询参数。此外，由于它是一个获取而不是一个帖子，因此不需要内容类型。

Answer 2

原来问题是使用GET时没有'data.d'成员。我不知道为什么。

如此改变，

thegrid.addJSONData(data.d)

到

thegrid.addJSONData(data)

修复了问题。

从WCF后端填充的jqGrid从POST切换到GET

2 个答案: