Json Data没有填充jqGrid

时间:2012-06-08 19:11:02

标签: json jqgrid asp.net-mvc-4

我的jqGrid没有填充 - 在Asp.net MVC 4中提交我的表单...我想找出原因...我有一个ajax方法返回这个Json字符串,它是一个Json字符串网络响应浏览器......

"{\"total\":1,\"page\":1,\"records\":1,\"rows\":[{\"cell\":[\"\",\"342352857634\",\"test\",\"test\",\"5/8/2012 11:39:38 AM\",\"1\",\"\",\"1/1/0001 12:00:00 AM\",\"1/1/0001 12:00:00 AM\",\"1/1/0001 12:00:00 AM\"]}]}"

这是完成所有魔术的功能。

$('#SearchPatID').submit(function (event) {
        //alert("What the motherFuck is going on here!");
        debugger;
        var theURL = this.action;
        var type = this.methd;
        event.preventDefault();
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            dataType: "json",
            success: function (result) {
                debugger;
                bindData(result);
            }
        });
        return false;
    });
    var bindData = function (result) {
    debugger;
    alert('Glad this is kind-of working!');
    $("#list").setGridParam({
        datatype: 'jsonstring',
        datastr: result,
        caption: 'Suck It!'
    }).trigger("reloadGrid");
    }

UPDATE ...我将bindData函数变为Just setGridParam。并重新加载...仍然无法正常工作,但我认为我最终走在正确的道路上......下面有更多更新......

我错过了什么?我有我的Json数据,一切都应该正常工作吗?

更新:
我意识到我发送了一个JSON字符串而不是一个JSON对象... 所以我从json将数据类型更改为jsonstring ... 仍然不起作用。

这是返回我的JSON数据的内容。 我现在正在尝试更新:我想尝试将列名放在数据中...出于某种原因,我认为这可能会有所帮助

public static object JsonHelper(TemplateModel model){

        var values = model.Template;
        var JsonDataList = new {
            total = 1,
            page = 1,
            records = model.Template.Count,
            rows = (from val in values
                    select new {
                        cell = //new string(
                            "[\"id\" :\"" + val.EncounterId +",\""+
                            //"\"MRN\" :" + 
                            "\"MRN\" :\"" + val.MRN + ",\"" +
                            //"\"Hospital_Fin\" :" + 
                            "\"Hospital_Fin\" :\"" + val.HostpitalFinNumber + ",\"" +
                            //"\"First_Name\" :"+ 
                            "\"First_Name\" :\"" + val.FirstName + ",\"" +
                            //"\"Last_Name\" :" + 
                            "\"Last_Name\" :\"" + val.LastName + ",\"" +
                            //"\"Date_of_birth\" :" + 
                            "\"Date_of_birth\" :\"" + val.DateOfBirth.ToString() + ",\"" +
                            //"\"Completed_Pathway\" :" + 
                            "\"Completed_Pathway\" :\"" + val.CompletedPathway + ",\"" +
                            //"\"Completed_Pathway_Reason\" :" + 
                            "\"Completed_Pathway_Reason\" :\"" + val.CompletedPathwayReason + ",\"" +
                            //"\"PCP_Appointment\" :" + 
                            "\"PCP_Appointment\" :\"" + val.PCPAppointmentDateTime.ToString() + ",\"" +
                            //"\"Specialist_Appointment\" :" + 
                            "\"Specialist_Appointment\" :\"" + val.SpecialistAppointmentDateTime.ToString() + ",\"" +
                            //"\"Admit_Date\" :" + 
                            "\"Admit_Date\" :\"" + val.AdminDate.ToString() + "\"]"                            
                    })//.ToArray()
        };
        return JsonDataList;
    }

...加

return Json(DataRepository.JsonHelper(model.FirstOrDefault()), JsonRequestBehavior.AllowGet);

这就是我设置jqGrid的方式......

$(document).ready(function () {
        $("#list").jqGrid({
                        shrinkToFit: false,
                        autowidth: true,
                        datatype: 'local',
                        mtype: 'POST',
                        colNames: ['Edit',
                                   'MRN',
                                   'Hospital Fin',
                                   'First Name',
                                   'Last Name',
                                   'Date of birth',
                                   'Completed Pathway',
                                   'Completed Pathway Reason',
                                   'PCP Appointment',
                                   'Specialist Appointment',
                                   'Admit Date'
                                   ],
                        colModel: [
                                   { name: 'Edit', width: 95, align: 'left' },
                                   { name: 'MRN', width: 125, align: 'left' },
                                   { name: 'Hospital_Fin', width: 145, align: 'left' },
                                   { name: 'First_Name', width: 115, align: 'left' },
                                   { name: 'Last_Name', width: 115, align: 'left' },
                                   { name: 'Date_of_birth', width: 145, align: 'left' },
                                   { name: 'Completed_Pathway', width: 125, align: 'left' },
                                   { name: 'Completed_Pathway_Reason', width: 165, align: 'left' },
                                   { name: 'PCP_Appointment', width: 115, align: 'left' },
                                   { name: 'Specialist_Appointment', width: 125, align: 'left' },
                                   { name: 'Admit_Date', width: 185, align: 'left' }],
                        rowNum: 10,
                        rowList: [5, 10, 20, 50],
                        sortname: 'Id',
                        sortorder: "desc",
                        viewrecords: true,
                        imgpath: '/Content/themes/UPMC-theme/images',
                        caption: 'My first grid'
    }); })

我在线阅读某处将数据类型设置为“local”,然后执行setGridParam和trigger('reload')会有所帮助。似乎合乎逻辑。但我仍然不确定这将如何起作用......仍然没有工作,但我正在给它旧的大学尝试......

UDPATE:进一步说明 我的JsonHelper只是试图写出一个有效的JsonString ...有没有人有他们如何经常这样做的例子?每当我只使用标准的Json ActionHelper时......我想我可以创建一个不同的对象返回值,但这意味着我将不得不使用更多的linq ...而这是另一天的冒险。

**更新2:已经过了几个月“ 你好。我被另一个项目分心了大约一个月。现在它开始结束,这段代码开始再次让我烦恼。我觉得我如此接近,但到目前为止......

无论如何,这是我所谈论的空jqGrid的一个例子...... example empty jqGrid
正如你所看到的,我有两行数据,但它们都没有,它们通常应该具有任何数据......

以下是调试模式下的数据......

["id" :"2005,""MRN" :"840108105,""Hospital_Fin" :"999999999999985,""First_Name" :"BETTY,""Last_Name" :"WHITE,""Date_of_birth" :"1/18/1951 12:00:00 AM,""Completed_Pathway" :",""Completed_Pathway_Reason" :",""PCP_Appointment" :"6/12/2012 12:00:00 AM,""Specialist_Appointment" :"6/12/2012 12:00:00 AM,""Admit_Date" :"7/5/2012 12:00:00 AM"]
["id" :"2025,""MRN" :"840108105,""Hospital_Fin" :"789654123000123,""First_Name" :"BETTY,""Last_Name" :"WHITE,""Date_of_birth" :"1/18/1951 12:00:00 AM,""Completed_Pathway" :",""Completed_Pathway_Reason" :",""PCP_Appointment" :"1/1/0001 12:00:00 AM,""Specialist_Appointment" :"1/1/0001 12:00:00 AM,""Admit_Date" :"7/6/2012 12:00:00 AM"]

这是我的JSON助手......这基本上是我从模型中创建的两个字符串对象... 这就是绑定期间JSON数据在客户端的样子......

{"total":1,"page":1,"records":2,"rows":[{"cell":"[\"id\" :\"2005,\"\"MRN\" :\"840108105,\"\"Hospital_Fin\" :\"999999999999985,\"\"First_Name\" :\"BETTY,\"\"Last_Name\" :\"WHITE,\"\"Date_of_birth\" :\"1/18/1951 12:00:00 AM,\"\"Completed_Pathway\" :\",\"\"Completed_Pathway_Reason\" :\",\"\"PCP_Appointment\" :\"6/12/2012 12:00:00 AM,\"\"Specialist_Appointment\" :\"6/12/2012 12:00:00 AM,\"\"Admit_Date\" :\"7/5/2012 12:00:00 AM\"]"},{"cell":"[\"id\" :\"2025,\"\"MRN\" :\"840108105,\"\"Hospital_Fin\" :\"789654123000123,\"\"First_Name\" :\"BETTY,\"\"Last_Name\" :\"WHITE,\"\"Date_of_birth\" :\"1/18/1951 12:00:00 AM,\"\"Completed_Pathway\" :\",\"\"Completed_Pathway_Reason\" :\",\"\"PCP_Appointment\" :\"1/1/0001 12:00:00 AM,\"\"Specialist_Appointment\" :\"1/1/0001 12:00:00 AM,\"\"Admit_Date\" :\"7/6/2012 12:00:00 AM\"]"}]}

只是查看我的数据,似乎有些混乱。我将尝试看看修复它是否会让它看起来更好。但如果您有任何其他建议,我一定会很感激。

2 个答案:

答案 0 :(得分:1)

我认为您在使用的服务器代码中存在严重问题。如果您使用参数$.ajax发出dataType: "json"请求,则$.ajax会将数据转换为对象。来自服务器的响应似乎将返回的对象转换为JSON 两次

我认为您首先使用total或{{1}将pagerecordsrowsJavaScriptSerializer属性首先手动转换为JSON。然后使用DataContractJsonSerializer返回结果字符串。结果,return Json(myJsonString);字符串将被另外编码。

此外,如果您想将数据用作JSON,则必须使用datastr: result而非datatype: 'jsonstring',这需要datatype: 'json'参数。

告诉您信任您的代码有其他问题。 url $("#list").jqGrid({...});元素创建网格,代码只能执行一次。编写当前代码,以便在每个表单提交时多次调用函数<table id="list"></table>

此外,您使用bindData会降低性能(您应始终使用gridview: false)。多年来,jGrid中不存在选项gridview: true。我想你得到了一些非常古老的jqGrid用法示例,并试图将其修改为你的目的。

我建议你从the answerthis one作为起点获得一些更近的​​例子。您最好直接使用imgpath并将其他参数发送到服务器,例如,如here所述,或使用datatype: 'json'(请参阅here)。

更新没有JSON对象。要么你只有一个对象,要么你有一个字符串可以表示编码的对象JSON standard

您无需使用任何$.serializeArray。 MVC操作应该返回JsonHelper之类的

Json(theObject)

};

此外,jqGrid的JSON数据的默认格式描述为here。您在return new { total = 1, page = 1, records = model.Template.Count, rows = ... 中发布的代码包含

JsonHelper

并生成rows = (from val in values select new { invdata = new string[]{ ...} }).ToArray() 作为没有rows属性和id属性而不是invdata的对象数组。要阅读您需要的数据,请至少包含cell。更好的方法是返回jsonReader: {cell: "invdata"}的正确数据。如果列表中的某些内容可以被解释为行的唯一ID,则可以在相应的列中包含id,使用key: true并将jsonReader: {cell: ""}填充为rows或数组哪些元素为数组或字符串。

答案 1 :(得分:0)

我认为你错过了eval。

  success: function (result) {
            debugger;
            var data = eval("(" + result.d + ")");
            bindData(data);
        }