在jqGrid中打开单元格单击的模态对话框

时间:2021-11-10 10:29:10

I am new to jqGrid. Can you please help me on this request.

我是jqGrid的新手。你能在这个问题上帮助我吗?

I would like to open a new modal dialog when a cell is double clicked in jqGrid. Each cell will open a different modal dialog and that depends on the column, row combination. So this has to be dynamically decided.

我想在jqGrid中双击单元时打开一个新的模态对话框。每个单元格将打开一个不同的模态对话框,这取决于列,行组合。这是动态决定的。

I am using asp.net mvc views to be shown in the dialog.

我正在使用asp.net mvc视图显示在对话框中。

Adding the code that I am working on : (not formatted still)

添加我正在处理的代码:(还没有格式化)

     $.ajax(
                {
                    type: "GET",
                    url: "/Forecast/GetColumnsAndData/",
                    data: "",
                    dataType: "json",
                    success: function (result) {
                        colN = jQuery.parseJSON(result.colNames);
                        colM = jQuery.parseJSON(result.colModel);
                        jQuery("#rowed2").jqGrid({
                            url: '/Forecast/GridData/',
                            datatype: 'json',
                            mtype: 'GET',
                            colNames: colN,
                            colModel: colM,
                            rowNum: 10,
                            rowList: [10, 20, 30],
                            viewrecords: true,
                            onCellSelect: function (rowid, iCol, cellcontent) {
                                //Need to add the code for modal dialog and criteria check
                            },
                            gridComplete: function () {
                                var ids = jQuery("#rowed2").jqGrid('getDataIDs');
                                for (var i = 0; i < ids.length; i++) {
                                    var cl = ids[i];
                                    be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"editrows('" + cl + "');\"  />";
                                    se = "<input style='height:22px;width:20px;' type='button' value='S' onclick=\"jQuery('#rowed2').saveRow('" + cl + "', '','/Forecast/GridDataSave/');\"  />";
                                    ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick=\"jQuery('#rowed2').restoreRow('" + cl + "');\" />";
                                    jQuery("#rowed2").jqGrid('setRowData', ids[i], { act: be + se + ce });
                                }
                            },

                            caption: "Forecast Details"
                        });
                        jQuery("#rowed2").jqGrid('navGrid', "#prowed2", { edit: true, add: false, del: false });
                        jQuery("#rowed2").jqGrid('setGroupHeaders', {
                            useColSpanStyle: true,
                            groupHeaders: [
                                { startColumnName: 'Hours1', numberOfColumns: 2, titleText: '<center>October</center>' },
                                { startColumnName: 'Hours2', numberOfColumns: 2, titleText: '<center>November</center>' }
                              ]
                        });
                    },
                    error: function (x, e) {
                        alert(x.readyState + " " + x.status + " " + e.msg);
                    }
                });

1 个解决方案

#1


1  

There's a jqGrid event for double click which you can use in jqGrid

有一个用于双击的jqGrid事件,您可以在jqGrid中使用它

ondblClickRow: function (rowId, iRow, iCol, e) {
    //new modal based on above
}

#1


1  

There's a jqGrid event for double click which you can use in jqGrid

有一个用于双击的jqGrid事件,您可以在jqGrid中使用它

ondblClickRow: function (rowId, iRow, iCol, e) {
    //new modal based on above
}