ParamQuery grid support forum

General Category => Help for ParamQuery Grid (free version) => Topic started by: shoushouleb on August 14, 2018, 11:26:54 am

Title: Add new row to nested grid
Post by: shoushouleb on August 14, 2018, 11:26:54 am

Hello,
How can I add a new empty row, to the nested grid, where the new row is added to the child grid of the current selected row.
Thanks,

Title: Re: Add new row to nested grid
Post by: paramvir on August 14, 2018, 11:58:29 am

reference to child grid can be obtained from rowData.pq_detail.child where rowData is row data of selected row of parent grid.

Once you have reference to child grid, you can use any API method of pqgrid on it.

Title: Re: Add new row to nested grid
Post by: shoushouleb on August 14, 2018, 12:14:59 pm

Thank you for your reply, I need to append a new row upon clicking the "New" button in the toolbar.Please check the attached image.

Title: Re: Add new row to nested grid
Post by: shoushouleb on August 14, 2018, 01:29:28 pm

This is the solution:

    toolbar: {
                                items: [
                                    {
                                        type: 'button', icon: 'ui-icon-plus', label: 'New', listener:
                                          {
                                              "click": function (evt, ui) {
                                                  debugger;

                                                  var $gridDet = $(this).closest('.pq-grid');

                                         
                                                  //append empty row at the end.
                                                  var rowData = { ID: "2", 'Name':'Has'}; //empty row
                                                  var rowIndx = $gridDet.pqGrid("addRow", { rowData: rowData, checkEditable: true });
                                                  $gridDet.pqGrid("goToPage", { rowIndx: rowIndx });
                                                  $gridDet.pqGrid("editFirstCellInRow", { rowIndx: rowIndx });
                                              }
                                          }
                                    }

                                ]