javascript - jqGrid 中的 onCellSelect 设置出现问题

Question

我成功地从我的 Controller 方法检索数据，并希望在 jqGrid 上显示数据。

我注意到在调试过程中，我收到一条弹出的错误消息(我没有预料到)，上面写着“元素不是表格”。

尝试为网格设置 onCellSelect 事件的行上发生错误。它似乎正在尝试读取尚未填充的网格中的数据。

请注意，我在此事件之后填充网格。此事件是在填充网格以从单元格中提取值之后发生的。

但是，我认为所有事件都需要在设计时在网格的定义上设置。

有人可以告诉我我在这里做错了什么吗？

这是我的相关代码:

$.ajax({
                            url: '@Url.Action("GetFilteredFuelTicketsAsync")',
                            type: "POST",
                            data: JSON.stringify(HH_FuelTkt_Input),
                            contentType: 'application/json; charset=utf-8',
                            dataType: "json",
                            success: function (data) {
                                $('#fuelTickets').jqGrid({
                                    caption: "Fuel Tickets",
                                    colNames: ["ID", "Ticket", "Vehicle", "Customer", "Date", "Image ID"],
                                    colModel: [
                                                { name: "FuelTkt_ID", viewable: false },
                                                { name: "Ticket_No", width: 30, align: "right" },
                                                { name: "Vehicle_No", width: 50 },
                                                { name: "Customer_Name", width: 100 },
                                                { name: "Trans_Timestamp", width: 100, datefmt: "yyyy-mm-dd" },
                                                { name: "Image_ID", width: 30 }
                                    ],
                                    datatype: "json",
                                    mtype: "GET",
                                    pager: true,
                                    sortname: "Ticket_No",
                                    sortorder: "Asc",
                                    viewRecords: true,
                                    gridview: true,
                                    autoWidth: true,
                                    emptyRecords: "No records found",
                                    onCellSelect: function (rowid, iCol, cellcontent) {
                                        var grid = $('#fuelTickets');
                                        var imageID = grid.jqGrid('getCell', rowid, 'Image_ID');
                                        if (imageID != "")
                                            DisplayReceipt(imageID);
                                    }
                                })
                                var grid = $("#fuelTickets");
                                var gridData = JSON.parse(data.d);
                                grid.clearGridData();
                                for (var i = 0; i < gridData.length; i++) {
                                    grid.addRowData(i + 1, gridData[i]);
                                }
                            },
                            error: function (jqXHR, jqXHR, textStatus, errorThrown) {
                                alert("No record found: " + "textStatus: " + textStatus + "\r\n" + "errorThrown: " + errorThrown);
                            }
                        });

将 JQGRID 放入表元素后进行编辑(解决了眼前的问题): 这是因为我没有在表格元素中定义 jqGrid...

但是，这里又出现了另一件事。

我在变量“data”中得到两条记录。

当我尝试处理这一行时，没有任何反应。浏览器只是挂起。我需要以不同的方式将数据绑定(bind)到网格吗？很明显，解析数据时出现问题，可能是时间戳问题。您能否建议我可以采取哪些措施来解决这个问题？

非常感谢。 var gridData = JSON.parse(data.d);

json 数据如下所示:

数据 [对象 { FuelTkt_ID=2, Ticket_No=6460193, Vehicle_No="123456", 更多...}, 对象 { FuelTkt_ID=3, Ticket_No=6460194, Vehicle_No="123456", 更多...}]

0 对象 { FuelTkt_ID=2、Ticket_No=6460193、Vehicle_No="123456"、更多...}

客户名称 “X”

FuelTkt_ID 2

图像 ID “12345”

票号 6460193

传输时间戳 “/日期(1395238800000)/”

车辆编号 “123456”

1 对象 { FuelTkt_ID=3、Ticket_No=6460194、Vehicle_No="123456"、更多...}

客户名称 “X”

FuelTkt_ID 3

图像 ID “22856”

票号 6460194

传输时间戳 “/日期(1395246000000)/”

车辆编号 “123456”

Answer 1

jqGrid 要求您附加到的元素是一个表格:

<table id="fuelTickets"> </table>