Question

我正在使用web方法获取json响应，但网格中的“刷新”按钮不起作用。

这是代码Behind：

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string getData()
{
    string data = GetJson();
    return data;
}

public static string GetJson()
{
    List<NameData> dataList = new List<NameData>();

    NameData data1 = new NameData();
    data1.pkNameID = 1;
    data1.Name = "Name_One";
    dataList.Add(data1);

    NameData data2 = new NameData();
    data2.pkNameID = 2;
    data2.Name = "Name_two";
    dataList.Add(data2);

    System.Web.Script.Serialization.JavaScriptSerializer js = new System.Web.Script.Serialization.JavaScriptSerializer();

    return js.Serialize(dataList);
}

public class NameData
{
    public int pkNameID { get; set; }

    public string Name { get; set; }
}

这是ajax脚本：

$(document).ready(function () {
        GetData();
    });

    function GetData() {
        $.ajax({
            type: "POST",
            url: "ListTest.aspx/getData",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            //async: false,
            success: function (response) {
                var item = $.parseJSON(response.d);
                if (item != null && item != "" && typeof (item) != 'undefined') {

                    $("#list").jqGrid({
                        url: 'ListTest.aspx/getData',
                        data: item,
                        datatype: 'local',
                        colNames: ['pkNameID', 'Name'],
                        colModel: [
                        { name: 'pkNameID', index: 'pkNameID', width: 30, align: 'left', stype: 'text', editable: false },
                        { name: 'Name', index: 'Name', width: 80, align: 'left', stype: 'text', editable: true }],
                        rowNum: 5,
                        rowList: [10, 20, 30],
                        pager: '#pager',
                        sortname: 'pkNameID',
                        sortorder: 'desc',
                        caption: "Test Grid",
                        viewrecords: true,
                        async: false,
                        loadonce: false,
                        gridview: true,
                        width: 500,
                        edit: true,

                        loadComplete: function (result) {
                            //alert(jQuery("#list").jqGrid('getGridParam', 'records'));
                        },
                        loadError: function (xhr) {
                            alert("The Status code:" + xhr.status + " Message:" + xhr.statusText);//Getting reponse 200 ok
                        }
                    }).navGrid('#pager', { edit: true, add: false, del: false, search: false, refresh: true });


                }
                else {
                    var result = '<tr align="left"><td>' + "No Record" + '</td></tr>';
                    $('#list').empty().append(result);
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert("error");
            }
        });
    }

因此，当我尝试单击刷新按钮（我需要服务器刷新）时，网格不会刷新。我尝试将数据类型：'local'更改为datatype：'json'，但这会得到错误代码：200。我不知道如何修复它。

感谢您将来的帮助！

Answer 1

我认为它不起作用，因为你在＆＃34;成功＆＃34;内创建了表格。 ajax电话。我建议添加一个调用getData函数的自定义刷新按钮（在函数开头添加$（＆＃34;＃list＆＃34;）。GridUnload（））或者在里面调用ajax jqgrid实例化。第一种方式应该更容易，虽然不那么优雅。下面是没有刷新按钮的第二个解决方案的示例，但应该很容易将其添加到此代码中：

$("#resTable").jqGrid({
        datatype: "json",
        mtype: 'POST',
        url: "../WS/myServices.asmx/GetData",
        postData: "{firstParam:" + JSON.stringify(firstParam) +
        ", secondParam:" + JSON.stringify(secondParam) +
        ", thirdParam:" + JSON.stringify(thirdParam) + "}",
        loadonce: true,
        jsonReader: {
            repeatitems: false,
            root: function (data) {
                if (data && data.d.length > 0) {
                    return data.d;                    
                }
                else
                    alert("No result");
            }
        },
        ajaxGridOptions: {
            contentType: "application/json",
            type: 'post',
            error: function (result) {
                alert(result.responseText);
            }
        },
        colModel: [
            { label: 'Action', name: 'act', width: 100, sortable: false },
            { label: 'Col1', name: 'Col1', width: 250, sortable: false, key: true },
            { label: 'Col2', name: 'Col2', width: 350, sortable: true },
            { label: 'Col3', name: 'Col3', width: 120, sortable: false },
            { label: 'Col4', name: 'Col4', width: 120, sortable: false, hidden:true }
        ],
        height: 'auto',
        loadComplete: function () {
            var ids = jQuery("#resTable").jqGrid('getDataIDs'); //get the row IDs
            for (var i = 0; i < ids.length; i++) {
                var funct = "javascript:someFunction('" + ids[i] + "');";
                be = '<input type="button" class = "Btn" value="Do something" onclick="' + funct + '"  />';
                jQuery("#resTable").jqGrid('setRowData', ids[i], { act: be });
            }
        },
        beforeSelectRow: function (rowid, e) { 
            return false; //to avoid selecting
        },
        hoverrows: false, //to avoid hovering
        caption: "My table"
    });

Ajax Jqgrid重新加载网格不工作c＃.net

1 个答案: