suggested change for the default toolbar for the paged grid

[jbowman]

How about putting the load indicator first?

My first endeavour into extending it, I've used the add function to add items to it. This puts them after the waiting icon, which is after all the default functional buttons. Just seems it would make more sense having it all the way to the left so that all the clickable/editable stuff is after it.

Edit: Pics and code :)
Old Toolbar (including example of customizations)
http://whasit.com/images/oldtoolbar.jpg

New Toolbar
http://whasit.com/images/newtoolbar.jpg

New Toolbar code


YAHOO.ext.grid.PagedGridView.prototype.createPagingToolbar = function(container){
var tb = new YAHOO.ext.Toolbar(container);
this.pageToolbar = tb;
this.loading = tb.addButton({
tooltip: this.refreshText,
className: 'ygrid-loading',
disabled: true,
click: this.onClick.createDelegate(this, ['refresh'])
});
tb.addSeparator();
this.first = tb.addButton({
tooltip: this.firstText,
className: 'ygrid-page-first',
disabled: true,
click: this.onClick.createDelegate(this, ['first'])
});
this.prev = tb.addButton({
tooltip: this.prevText,
className: 'ygrid-page-prev',
disabled: true,
click: this.onClick.createDelegate(this, ['prev'])
});
tb.addSeparator();
tb.add(this.beforePageText);
var pageBox = document.createElement('input');
pageBox.type = 'text';
pageBox.size = 3;
pageBox.value = '1';
pageBox.className = 'ygrid-page-number';
tb.add(pageBox);
this.field = getEl(pageBox, true);
this.field.mon('keydown', this.onEnter, this, true);
this.field.on('focus', function(){pageBox.select();});
this.afterTextEl = tb.addText(this.afterPageText.replace('%0', '1'));
this.field.setHeight(18);
tb.addSeparator();
this.next = tb.addButton({
tooltip: this.nextText,
className: 'ygrid-page-next',
disabled: true,
click: this.onClick.createDelegate(this, ['next'])
});
this.last = tb.addButton({
tooltip: this.lastText,
className: 'ygrid-page-last',
disabled: true,
click: this.onClick.createDelegate(this, ['last'])
});
tb.addSeparator();
this.onPageLoaded(1, this.grid.dataModel.getTotalPages());
};

[jack.slocum]

It looks good with other items, but when you put it first and you have no extra stuff on the toolbar it looks odd (IMO). With few other votes though I can be overridden. :)

In the meantime, definitely post this in the "Extras" forum.

[jbowman]

ok, added it to the extra forums, hopefully with good enough instructions so as not to confuse anyone :)

[Animal]

I've posted up an insertButton Toolbar method so that you can poke buttons into a Toolbar at any position. I think Jack has incorporated it. You could use that to put your new buttons in a logical place.

[jarrod]

Hmm... we'll also need an insertSeparator?

[Animal]

Should be easy to do.