Problem with toolbar option and groupModel live removal

[motoguru]

Hello again,

I'm trying to add a toolbar within jQuery click event raised by some DOM element clicked. As in this click handler I have my previously prepared "obj" (which were used to make my grid), I'm trying to modify grid's toolbar in two ways. One way is the way which is suitable for me (and should work according to API, but it is't):

  var currentFilterValues= {11,22,33,44};
 var toolbarItems = new Array();

                    for (n in currentFilterValues) {
                        toolbarItems.push({type: '<span class="groupCol">'+currentFilterValues[n]+'</span> <span id="remCG'+currentFilterValues[n]+'">(remove)</span>'});
                        toolbarItems.push({type: 'separator' });
                    }

//then, I'm trying do put the new toolbar into the existing grid:

 var toolbar = {
                        cls: 'pq-toolbar-crud',
                        items: toolbarItems
                    }

  $grid.pqGrid('option', 'showToolbar', true); //just in case
 // $grid.pqGrid({ toolbar: { cls: '', items: [{ type: 'selector' }, { type: '<span>test</span>' }] } }); //this one doesn't work either
$grid.pqGrid({ toolbar: toolbar });
//  $grid.pqGrid("option", "toolbar",toolbar); //this one does't work either
  $grid.pqGrid('refresh'); //is it necessary here..? but just in case I raised the refresh event

Then it does nothing. The second way is not suitable for me but, obviously, works:

var currentFilterValues= {11,22,33,44};
 var toolbarItems = new Array();

                    for (n in currentFilterValues) {
                        toolbarItems.push({type: '<span class="groupCol">'+currentFilterValues[n]+'</span> <span id="remCG'+currentFilterValues[n]+'">(remove)</span>'});
                        toolbarItems.push({type: 'separator' });
                    }

//then, destroy and make new grid for modified obj:

 var toolbar = {
                        cls: 'pq-toolbar-crud',
                        items: toolbarItems
                    }

  obj.toolbar = toolbar;
  $grid.pqGrid("destroy").pqGrid(obj);

And it works, but I can't do it as I'm losing all the live modifications and starting the grid from scratch.

Can You introduce some code which modifies "toolbar" in existing grid without destroying it and making new one? As noted above I've already tried to use API toolbar option and it does nothing for me.

Thanks in advance



EDIT:

The same thing is with groupModel removal. When I set the groupModel on live grid, it works fine. But when I'm trying to remove whole grouping (with setting groupModel = {};) pqgrid gives error:

TypeError: GMdataIndx is undefined

for (var i = 0; i < GMdataIndx.length; i++) {

pqgrid.dev.js (row 9636)

And when I'm trying do to this making all the arrays in groupModel object empty:

var groupModel = {
            dataIndx: {},
            collapsed: {},
            title: {},
            dir: {}
            //,icon: ["circle-plus", "circle-triangle", "triangle"]
        };


I'm getting this instead:

TypeError: rowData is undefined
rowData.rowIndx = i + rowOffset;
pqgrid.dev.js (row 8954)


Every change is set this way:

$("#myGrid").pqGrid("option", "groupModel", groupModel).pqGrid('refreshDataAndView');

[paramvir]

Refresh Toolbar
====================================
The right way to set the new toolbar option is

$grid.pqGrid("option", "toolbar",toolbar);

It didn't work because there is an absence of setter in the toolbar API
http://paramquery.com/pro/api#option-toolbar

To support the setter, you can either apply the below patch or wait for the next version.

Code: [Select]

//should be put after pqgrid js file.
    $(function () {
        var pq = $.paramquery.pqGrid.prototype;
        var _pq_setOption = pq._setOption;
        pq._setOption = function (key, val) {
            if (key == "toolbar") {
                this.$toolbar.remove();
                this._super.call(this, key, val);
                this._createToolbar();
            }
            else {
                _pq_setOption.call(this, key, val);
            }
        }
    });


Removal of groupModel
===============================================================

It should be set to null for removal.

Code: [Select]

  $grid.pqGrid("option", "groupModel", null ).pqGrid( "refreshDataAndView" );

If location is 'remote', and it's required to refresh / remove groupModel without reload of data from server.

Code: [Select]

            $grid.pqGrid("option", "dataModel.location", "local");//make it local to avoid remote call.
            $grid.pqGrid("option", "groupModel", null).pqGrid("refreshDataAndView");
            $grid.pqGrid("option", "dataModel.location", "remote");//switch back to remote location.


[motoguru]

Refresh toolbar:

Yeah there was no setter example in API, but was information we could get or set the toolbar so I decided to try doing as with other options

The patch didn't worked for me (or maybe I have to refresh view in other way than "refresh"?) but don't worry I'll wait till the next version as I solved it differently for now.



GM removal:

Worked perfectly. Thank You. That was trivial... Sorry for stupid question

[paramvir]

Sounds good!

The patch is supposed to work as intended. It could be added in a separate js file ( to be included in the page after pqgrid js file) or it can be added inline in script tags ( but before initialization of the pqgrid ).

The toolbar setter would work once the patch is added.

$grid.pqGrid("option", "toolbar",toolbar);