ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: megastream on January 28, 2019, 07:01:57 pm

Title: Add New Row functionality not working with infinite scrolling
Post by: megastream on January 28, 2019, 07:01:57 pm

I've a grid with Infinite scrolling functionality.

I've a button there to add a new row so that user can enter data and it can be saved in database.

Autosave functionality is also enabled so as soon as i click on "New Item" button, grid saves itself and returns item ID.

All these things work fine when there are less rows.

Once there are a lot of rows and when i click on "New Items" button, grid scrolls to the bottom first and then adds a new row.

But Autosave does not call this time.

If i again click on "New Item" button then it creates a new row, first cell is in edit mode and then Autosave calls automatically and then it returns ID for the newly added row.

I am not sure why i does not call autosave first time when grid scrolls to bottom and a new row is added.

Please suggest what should i need to do.

Here is my toolbar code:
toolbar: {
    items: [{
        type: 'button',
        icon: 'ui-icon-plus',
        label: 'New Item',
        listener: function () {
            //append empty row at the end.
            var rowData = {
                catAttr_138022: "",
                catAttr_138021: "",
            }; //empty row template
            var rowIndx = $grid.pqGrid('addRow', { rowData: rowData });
            $grid.pqGrid('goToPage', { rowIndx: rowIndx });
            $grid.pqGrid('editFirstCellInRow', { rowIndx: rowIndx });
        }
    },
    { type: 'separator' },
    {
        type: 'button',
        icon: 'ui-icon-arrowreturn-1-s',
        label: 'Undo',
        cls: 'changes',
        options: { disabled: true },
        listener: {
            "click": function (evt, ui) {
                    $grid.pqGrid("history", { method: 'undo' });
                }
        }
    },
    {
        type: 'button',
        icon: 'ui-icon-arrowrefresh-1-s',
        label: 'Redo',
        options: { disabled: true },
        listener: {
            "click": function (evt, ui) {
                    $grid.pqGrid("history", { method: 'redo' });
                }
        }
    }]
},

Title: Re: Add New Row functionality not working with infinite scrolling
Post by: paramvir on January 29, 2019, 10:14:54 am

Infinite scrolling is used for reporting / view purpose with sorting, filtering, etc.

For editing please choose amongst these demos:

https://paramquery.com/pro/demos/editing

https://paramquery.com/pro/demos/editing_batch

https://paramquery.com/pro/demos/editing_instant

Title: Re: Add New Row functionality not working with infinite scrolling
Post by: megastream on January 29, 2019, 07:11:11 pm

Hello,

Thanks for your reply.

I understand your point but all things are working fine with Infinite scrolling.

And i want to continue using infinite scrolling.

So could you please suggest that how can i fix the issue while using Infinite scrolling?

Is there any custom solution? If there then please share that, I'll apply it.

Thanks

Title: Re: Add New Row functionality not working with infinite scrolling
Post by: paramvir on January 30, 2019, 07:45:08 am

you can try to insert new row at current scroll location instead of append.

Current scroll position in terms of rowIndx can be obtained from getViewPortIndx method.

https://paramquery.com/pro/api#method-getViewPortIndx