Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, {
- /**
- * Override this function to apply custom css classes to rows during rendering
- * @param {Record} record The record
- * @param {Number} index
- * @method getRowClass
- */
+ unselectable : 'unselectable="on"',
+ unselectableCls : 'x-unselectable',
+
+
rowClass : "x-grid-row",
cellClass : "x-grid-col",
},
init: function(grid){
- Roo.grid.GridView.superclass.init.call(this, grid);
+ Roo.grid.GridView.superclass.init.call(this, grid);
- this.bind(grid.dataSource, grid.colModel);
+ this.bind(grid.dataSource, grid.colModel);
- grid.on("headerclick", this.handleHeaderClick, this);
+ grid.on("headerclick", this.handleHeaderClick, this);
if(grid.trackMouseOver){
grid.on("mouseover", this.onRowOver, this);
- grid.on("mouseout", this.onRowOut, this);
- }
- grid.cancelTextSelection = function(){};
- this.gridId = grid.id;
-
- var tpls = this.templates || {};
-
- if(!tpls.master){
- tpls.master = new Roo.Template(
- '<div class="x-grid" hidefocus="true">',
- '<div class="x-grid-topbar"></div>',
- '<div class="x-grid-scroller"><div></div></div>',
- '<div class="x-grid-locked">',
- '<div class="x-grid-header">{lockedHeader}</div>',
- '<div class="x-grid-body">{lockedBody}</div>',
- "</div>",
- '<div class="x-grid-viewport">',
- '<div class="x-grid-header">{header}</div>',
- '<div class="x-grid-body">{body}</div>',
- "</div>",
- '<div class="x-grid-bottombar"></div>',
- '<a href="#" class="x-grid-focus" tabIndex="-1"></a>',
- '<div class="x-grid-resize-proxy"> </div>',
- "</div>"
- );
- tpls.master.disableformats = true;
- }
-
- if(!tpls.header){
- tpls.header = new Roo.Template(
- '<table border="0" cellspacing="0" cellpadding="0">',
- '<tbody><tr class="x-grid-hd-row">{cells}</tr></tbody>',
- "</table>{splits}"
- );
- tpls.header.disableformats = true;
- }
- tpls.header.compile();
-
- if(!tpls.hcell){
- tpls.hcell = new Roo.Template(
- '<td class="x-grid-hd x-grid-td-{id} {cellId}"><div title="{title}" class="x-grid-hd-inner x-grid-hd-{id}">',
- '<div class="x-grid-hd-text" unselectable="on">{value}<img class="x-grid-sort-icon" src="', Roo.BLANK_IMAGE_URL, '" /></div>',
- "</div></td>"
- );
- tpls.hcell.disableFormats = true;
- }
- tpls.hcell.compile();
-
- if(!tpls.hsplit){
- tpls.hsplit = new Roo.Template('<div class="x-grid-split {splitId} x-grid-split-{id}" style="{style}" unselectable="on"> </div>');
- tpls.hsplit.disableFormats = true;
- }
- tpls.hsplit.compile();
-
- if(!tpls.body){
- tpls.body = new Roo.Template(
- '<table border="0" cellspacing="0" cellpadding="0">',
- "<tbody>{rows}</tbody>",
- "</table>"
- );
- tpls.body.disableFormats = true;
- }
- tpls.body.compile();
-
- if(!tpls.row){
- tpls.row = new Roo.Template('<tr class="x-grid-row {alt}">{cells}</tr>');
- tpls.row.disableFormats = true;
- }
- tpls.row.compile();
-
- if(!tpls.cell){
- tpls.cell = new Roo.Template(
- '<td class="x-grid-col x-grid-td-{id} {cellId} {css}" tabIndex="0">',
- '<div class="x-grid-col-{id} x-grid-cell-inner"><div class="x-grid-cell-text" unselectable="on" {attr}>{value}</div></div>',
- "</td>"
- );
+ grid.on("mouseout", this.onRowOut, this);
+ }
+ grid.cancelTextSelection = function(){};
+ this.gridId = grid.id;
+
+ var tpls = this.templates || {};
+
+ if(!tpls.master){
+ tpls.master = new Roo.Template(
+ '<div class="x-grid" hidefocus="true">',
+ '<a href="#" class="x-grid-focus" tabIndex="-1"></a>',
+ '<div class="x-grid-topbar"></div>',
+ '<div class="x-grid-scroller"><div></div></div>',
+ '<div class="x-grid-locked">',
+ '<div class="x-grid-header">{lockedHeader}</div>',
+ '<div class="x-grid-body">{lockedBody}</div>',
+ "</div>",
+ '<div class="x-grid-viewport">',
+ '<div class="x-grid-header">{header}</div>',
+ '<div class="x-grid-body">{body}</div>',
+ "</div>",
+ '<div class="x-grid-bottombar"></div>',
+
+ '<div class="x-grid-resize-proxy"> </div>',
+ "</div>"
+ );
+ tpls.master.disableformats = true;
+ }
+
+ if(!tpls.header){
+ tpls.header = new Roo.Template(
+ '<table border="0" cellspacing="0" cellpadding="0">',
+ '<tbody><tr class="x-grid-hd-row">{cells}</tr></tbody>',
+ "</table>{splits}"
+ );
+ tpls.header.disableformats = true;
+ }
+ tpls.header.compile();
+
+ if(!tpls.hcell){
+ tpls.hcell = new Roo.Template(
+ '<td class="x-grid-hd x-grid-td-{id} {cellId}"><div title="{title}" class="x-grid-hd-inner x-grid-hd-{id}">',
+ '<div class="x-grid-hd-text ' + this.unselectableCls + '" ' + this.unselectable +'>{value}<img class="x-grid-sort-icon" src="', Roo.BLANK_IMAGE_URL, '" /></div>',
+ "</div></td>"
+ );
+ tpls.hcell.disableFormats = true;
+ }
+ tpls.hcell.compile();
+
+ if(!tpls.hsplit){
+ tpls.hsplit = new Roo.Template('<div class="x-grid-split {splitId} x-grid-split-{id}" style="{style} ' +
+ this.unselectableCls + '" ' + this.unselectable +'> </div>');
+ tpls.hsplit.disableFormats = true;
+ }
+ tpls.hsplit.compile();
+
+ if(!tpls.body){
+ tpls.body = new Roo.Template(
+ '<table border="0" cellspacing="0" cellpadding="0">',
+ "<tbody>{rows}</tbody>",
+ "</table>"
+ );
+ tpls.body.disableFormats = true;
+ }
+ tpls.body.compile();
+
+ if(!tpls.row){
+ tpls.row = new Roo.Template('<tr class="x-grid-row {alt}">{cells}</tr>');
+ tpls.row.disableFormats = true;
+ }
+ tpls.row.compile();
+
+ if(!tpls.cell){
+ tpls.cell = new Roo.Template(
+ '<td class="x-grid-col x-grid-td-{id} {cellId} {css}" tabIndex="0">',
+ '<div class="x-grid-col-{id} x-grid-cell-inner"><div class="x-grid-cell-text ' +
+ this.unselectableCls + '" ' + this.unselectable +'" {attr}>{value}</div></div>',
+ "</td>"
+ );
tpls.cell.disableFormats = true;
}
- tpls.cell.compile();
+ tpls.cell.compile();
- this.templates = tpls;
- },
+ this.templates = tpls;
+ },
- // remap these for backwards compat
+ // remap these for backwards compat
onColWidthChange : function(){
this.updateColumns.apply(this, arguments);
},
this.updateHeaderSortState();
},
- onClear : function(){
+ onClear : function(){
this.refresh();
},
- onUpdate : function(ds, record){
+ onUpdate : function(ds, record){
this.refreshRow(record);
},
this.headerPanel.show();
}
return this.headerPanel;
- },
+ },
- /**
+ /**
* Gets a panel in the footer of the grid that can be used for toolbars etc.
* After modifying the contents of this panel a call to grid.autoSize() may be
* required to register any changes in size.
this.footerPanel.show();
}
return this.footerPanel;
- },
+ },
- initElements : function(){
- var E = Roo.Element;
- var el = this.grid.getGridEl().dom.firstChild;
- var cs = el.childNodes;
+ initElements : function(){
+ var E = Roo.Element;
+ var el = this.grid.getGridEl().dom.firstChild;
+ var cs = el.childNodes;
- this.el = new E(el);
- this.headerPanel = new E(el.firstChild);
- this.headerPanel.enableDisplayMode("block");
+ this.el = new E(el);
+
+ this.focusEl = new E(el.firstChild);
+ this.focusEl.swallowEvent("click", true);
+
+ this.headerPanel = new E(cs[1]);
+ this.headerPanel.enableDisplayMode("block");
- this.scroller = new E(cs[1]);
- this.scrollSizer = new E(this.scroller.dom.firstChild);
+ this.scroller = new E(cs[2]);
+ this.scrollSizer = new E(this.scroller.dom.firstChild);
- this.lockedWrap = new E(cs[2]);
- this.lockedHd = new E(this.lockedWrap.dom.firstChild);
- this.lockedBody = new E(this.lockedWrap.dom.childNodes[1]);
+ this.lockedWrap = new E(cs[3]);
+ this.lockedHd = new E(this.lockedWrap.dom.firstChild);
+ this.lockedBody = new E(this.lockedWrap.dom.childNodes[1]);
- this.mainWrap = new E(cs[3]);
- this.mainHd = new E(this.mainWrap.dom.firstChild);
- this.mainBody = new E(this.mainWrap.dom.childNodes[1]);
+ this.mainWrap = new E(cs[4]);
+ this.mainHd = new E(this.mainWrap.dom.firstChild);
+ this.mainBody = new E(this.mainWrap.dom.childNodes[1]);
- this.footerPanel = new E(cs[4]);
- this.footerPanel.enableDisplayMode("block");
+ this.footerPanel = new E(cs[5]);
+ this.footerPanel.enableDisplayMode("block");
- this.focusEl = new E(cs[5]);
- this.focusEl.swallowEvent("click", true);
this.resizeProxy = new E(cs[6]);
- this.headerSelector = String.format(
- '#{0} td.x-grid-hd, #{1} td.x-grid-hd',
- this.lockedHd.id, this.mainHd.id
- );
+ this.headerSelector = String.format(
+ '#{0} td.x-grid-hd, #{1} td.x-grid-hd',
+ this.lockedHd.id, this.mainHd.id
+ );
- this.splitterSelector = String.format(
- '#{0} div.x-grid-split, #{1} div.x-grid-split',
- this.idToCssName(this.lockedHd.id), this.idToCssName(this.mainHd.id)
- );
+ this.splitterSelector = String.format(
+ '#{0} div.x-grid-split, #{1} div.x-grid-split',
+ this.idToCssName(this.lockedHd.id), this.idToCssName(this.mainHd.id)
+ );
},
idToCssName : function(s)
{
return s.replace(/[^a-z0-9]+/ig, '-');
},
- getHeaderCell : function(index){
- return Roo.DomQuery.select(this.headerSelector)[index];
- },
+ getHeaderCell : function(index){
+ return Roo.DomQuery.select(this.headerSelector)[index];
+ },
- getHeaderCellMeasure : function(index){
- return this.getHeaderCell(index).firstChild;
- },
+ getHeaderCellMeasure : function(index){
+ return this.getHeaderCell(index).firstChild;
+ },
- getHeaderCellText : function(index){
- return this.getHeaderCell(index).firstChild.firstChild;
- },
+ getHeaderCellText : function(index){
+ return this.getHeaderCell(index).firstChild.firstChild;
+ },
- getLockedTable : function(){
- return this.lockedBody.dom.firstChild;
- },
+ getLockedTable : function(){
+ return this.lockedBody.dom.firstChild;
+ },
- getBodyTable : function(){
- return this.mainBody.dom.firstChild;
- },
+ getBodyTable : function(){
+ return this.mainBody.dom.firstChild;
+ },
- getLockedRow : function(index){
- return this.getLockedTable().rows[index];
- },
+ getLockedRow : function(index){
+ return this.getLockedTable().rows[index];
+ },
- getRow : function(index){
- return this.getBodyTable().rows[index];
- },
+ getRow : function(index){
+ return this.getBodyTable().rows[index];
+ },
- getRowComposite : function(index){
- if(!this.rowEl){
- this.rowEl = new Roo.CompositeElementLite();
- }
+ getRowComposite : function(index){
+ if(!this.rowEl){
+ this.rowEl = new Roo.CompositeElementLite();
+ }
var els = [], lrow, mrow;
if(lrow = this.getLockedRow(index)){
els.push(lrow);
els.push(mrow);
}
this.rowEl.elements = els;
- return this.rowEl;
- },
-
- getCell : function(rowIndex, colIndex){
- var locked = this.cm.getLockedCount();
- var source;
- if(colIndex < locked){
- source = this.lockedBody.dom.firstChild;
- }else{
- source = this.mainBody.dom.firstChild;
- colIndex -= locked;
- }
+ return this.rowEl;
+ },
+ /**
+ * Gets the 'td' of the cell
+ *
+ * @param {Integer} rowIndex row to select
+ * @param {Integer} colIndex column to select
+ *
+ * @return {Object}
+ */
+ getCell : function(rowIndex, colIndex){
+ var locked = this.cm.getLockedCount();
+ var source;
+ if(colIndex < locked){
+ source = this.lockedBody.dom.firstChild;
+ }else{
+ source = this.mainBody.dom.firstChild;
+ colIndex -= locked;
+ }
return source.rows[rowIndex].childNodes[colIndex];
- },
+ },
- getCellText : function(rowIndex, colIndex){
- return this.getCell(rowIndex, colIndex).firstChild.firstChild;
- },
+ getCellText : function(rowIndex, colIndex){
+ return this.getCell(rowIndex, colIndex).firstChild.firstChild;
+ },
- getCellBox : function(cell){
- var b = this.fly(cell).getBox();
+ getCellBox : function(cell){
+ var b = this.fly(cell).getBox();
if(Roo.isOpera){ // opera fails to report the Y
b.y = cell.offsetTop + this.mainBody.getY();
}
},
getColumnId : function(index){
- return this.cm.getColumnId(index);
- },
+ return this.cm.getColumnId(index);
+ },
- getSplitters : function(){
- if(this.splitterSelector){
- return Roo.DomQuery.select(this.splitterSelector);
- }else{
- return null;
- }
- },
+ getSplitters : function()
+ {
+ if(this.splitterSelector){
+ return Roo.DomQuery.select(this.splitterSelector);
+ }else{
+ return null;
+ }
+ },
- getSplitter : function(index){
- return this.getSplitters()[index];
- },
+ getSplitter : function(index){
+ return this.getSplitters()[index];
+ },
onRowOver : function(e, t){
var row;
},
renderHeaders : function(){
- var cm = this.cm;
+ var cm = this.cm;
var ct = this.templates.hcell, ht = this.templates.header, st = this.templates.hsplit;
var cb = [], lb = [], sb = [], lsb = [], p = {};
for(var i = 0, len = cm.getColumnCount(); i < len; i++){
}
return [ht.apply({cells: lb.join(""), splits:lsb.join("")}),
ht.apply({cells: cb.join(""), splits:sb.join("")})];
- },
+ },
- updateHeaders : function(){
+ updateHeaders : function(){
var html = this.renderHeaders();
this.lockedHd.update(html[0]);
this.mainHd.update(html[1]);
* Focuses the specified row.
* @param {Number} row The row index
*/
- focusRow : function(row){
+ focusRow : function(row)
+ {
+ //Roo.log('GridView.focusRow');
var x = this.scroller.dom.scrollLeft;
this.focusCell(row, 0, false);
this.scroller.dom.scrollLeft = x;
* @param {Number} col The column index
* @param {Boolean} hscroll false to disable horizontal scrolling
*/
- focusCell : function(row, col, hscroll){
+ focusCell : function(row, col, hscroll)
+ {
+ //Roo.log('GridView.focusCell');
var el = this.ensureVisible(row, col, hscroll);
this.focusEl.alignTo(el, "tl-tl");
if(Roo.isGecko){
* @param {Number} col The column index
* @param {Boolean} hscroll false to disable horizontal scrolling
*/
- ensureVisible : function(row, col, hscroll){
+ ensureVisible : function(row, col, hscroll)
+ {
+ //Roo.log('GridView.ensureVisible,' + row + ',' + col);
+ //return null; //disable for testing.
if(typeof row != "number"){
row = row.rowIndex;
}
if(row < 0 && row >= this.ds.getCount()){
- return;
+ return null;
}
col = (col !== undefined ? col : 0);
var cm = this.grid.colModel;
var el = this.getCell(row, col);
if(!el){
- return;
+ return null;
}
var c = this.scroller.dom;
var cleft = parseInt(el.offsetLeft, 10);
var cbot = ctop + el.offsetHeight;
var cright = cleft + el.offsetWidth;
-
+
var ch = c.clientHeight - this.mainHd.dom.offsetHeight;
var stop = parseInt(c.scrollTop, 10);
var sleft = parseInt(c.scrollLeft, 10);
var sbot = stop + ch;
var sright = sleft + c.clientWidth;
-
+ /*
+ Roo.log('GridView.ensureVisible:' +
+ ' ctop:' + ctop +
+ ' c.clientHeight:' + c.clientHeight +
+ ' this.mainHd.dom.offsetHeight:' + this.mainHd.dom.offsetHeight +
+ ' stop:' + stop +
+ ' cbot:' + cbot +
+ ' sbot:' + sbot +
+ ' ch:' + ch
+ );
+ */
if(ctop < stop){
- c.scrollTop = ctop;
+ c.scrollTop = ctop;
+ //Roo.log("set scrolltop to ctop DISABLE?");
}else if(cbot > sbot){
+ //Roo.log("set scrolltop to cbot-ch");
c.scrollTop = cbot-ch;
}
-
+
if(hscroll !== false){
if(cleft < sleft){
c.scrollLeft = cleft;
c.scrollLeft = cright-c.clientWidth;
}
}
+
return el;
},
if(s){ // splitters not created yet
var pos = 0, locked = true;
for(var i = 0, len = cm.getColumnCount(); i < len; i++){
- if(cm.isHidden(i)) continue;
- var w = cm.getColumnWidth(i);
+ if(cm.isHidden(i)) {
+ continue;
+ }
+ var w = cm.getColumnWidth(i); // make sure it's a number
if(!cm.isLocked(i) && locked){
pos = 0;
locked = false;
},
getScrollState : function(){
+
var sb = this.scroller.dom;
return {left: sb.scrollLeft, top: sb.scrollTop};
},
},
restoreScroll : function(state){
+ //Roo.log('GridView.restoreScroll');
var sb = this.scroller.dom;
sb.scrollLeft = state.left;
sb.scrollTop = state.top;
},
syncScroll : function(){
+ //Roo.log('GridView.syncScroll');
var sb = this.scroller.dom;
var sh = this.mainHd.dom;
var bs = this.mainBody.dom;
name : typeof name == 'undefined' ? ds.fields.get(i).name : name,
renderer : cm.getRenderer(i),
id : cm.getColumnId(i),
- locked : cm.isLocked(i)
+ locked : cm.isLocked(i),
+ has_editor : cm.editor ? true : false
};
}
p.id = c.id;
p.css = p.attr = "";
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);
- if(p.value == undefined || p.value === "") p.value = " ";
- if(r.dirty && typeof r.modified[c.name] !== 'undefined'){
- p.css += p.css ? ' x-grid-dirty-cell' : 'x-grid-dirty-cell';
+ if(p.value == undefined || p.value === "") {
+ p.value = " ";
+ }
+ if(c.has_editor){
+ Roo.log("adding editable celel css");
+ p.css += ' x-grid-editable-cell';
+ }
+ if(c.dirty && typeof r.modified[c.name] !== 'undefined'){
+ p.css += ' x-grid-dirty-cell';
}
var markup = ct.apply(p);
if(!c.locked){
alt.push(this.getRowClass(r, rowIndex));
}
if (hasListener) {
- rowcfg =
+ rowcfg = {
+
record: r,
rowIndex : rowIndex,
- rowClass : '';
- }
+ rowClass : ''
+ };
this.grid.fireEvent('rowclass', this, rowcfg);
alt.push(rowcfg.rowClass);
}
var ts = this.templates, ct = ts.cell, rt = ts.row;
// buffers
var buf = [], lbuf = [], cb, lcb, c, p = {}, rp = {}, r, rowIndex;
+ var hasListener = this.grid.hasListener('rowclass');
+
+ var rowcfg = {};
for(var j = 0, len = rs.length; j < len; j++){
r = rs[j]; cb = []; lcb = []; rowIndex = (j+startRow);
for(var i = 0; i < colCount; i++){
p.id = c.id;
p.css = p.attr = "";
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);
- if(p.value == undefined || p.value === "") p.value = " ";
+ if(p.value == undefined || p.value === "") {
+ p.value = " ";
+ }
+ //Roo.log(c);
+ if(c.has_editor){
+ Roo.log("adding editable celel css");
+ p.css += ' x-grid-editable-cell';
+ }
if(r.dirty && typeof r.modified[c.name] !== 'undefined'){
- p.css += p.css ? ' x-grid-dirty-cell' : 'x-grid-dirty-cell';
+ p.css += ' x-grid-dirty-cell'
}
+
var markup = ct.apply(p);
if(!c.locked){
cb[cb.length] = markup;
}
var alt = [];
if(stripe && ((rowIndex+1) % 2 == 0)){
- alt[0] = "x-grid-row-alt";
+ alt.push( "x-grid-row-alt");
}
if(r.dirty){
- alt[1] = " x-grid-dirty-row";
+ alt.push(" x-grid-dirty-row");
}
rp.cells = lcb;
if(this.getRowClass){
- alt[2] = this.getRowClass(r, rowIndex);
+ alt.push( this.getRowClass(r, rowIndex));
}
+ if (hasListener) {
+ rowcfg = {
+
+ record: r,
+ rowIndex : rowIndex,
+ rowClass : ''
+ };
+ this.grid.fireEvent('rowclass', this, rowcfg);
+ alt.push(rowcfg.rowClass);
+ }
+ Roo.log(alt);
rp.alt = alt.join(" ");
rp.cells = lcb.join("");
lbuf[lbuf.length] = rt.apply(rp);
if(this.enableMoveAnim && Roo.enableFx){
this.fly(this.getHeaderCell(colIndex).firstChild).highlight(this.hlColor);
}
+ // if multisort - fix sortOrder, and reload..
+ if (this.grid.dataSource.multiSort) {
+ // the we can call sort again..
+ var dm = this.grid.dataSource;
+ var cm = this.grid.colModel;
+ var so = [];
+ for(var i = 0; i < cm.config.length; i++ ) {
+
+ if ((typeof(dm.sortToggle[cm.config[i].dataIndex]) == 'undefined')) {
+ continue; // dont' bother, it's not in sort list or being set.
+ }
+
+ so.push(cm.config[i].dataIndex);
+ };
+ dm.sortOrder = so;
+ dm.load(dm.lastOptions);
+
+
+ }
+
},
updateCell : function(dm, rowIndex, dataIndex){
};
var renderer = cm.getRenderer(colIndex);
var val = renderer(dm.getValueAt(rowIndex, dataIndex), p, rowIndex, colIndex, dm);
- if(typeof val == "undefined" || val === "") val = " ";
+ if(typeof val == "undefined" || val === "") {
+ val = " ";
+ }
cellText.innerHTML = val;
cell.className = this.cellClass + " " + this.idToCssName(p.cellId) + " " + p.css;
this.syncRowHeights(rowIndex, rowIndex);
},
updateHeaderSortState : function(){
- var state = this.ds.getSortState();
- if(!state){
- return;
- }
- this.sortState = state;
- var sortColumn = this.cm.findColumnIndex(state.field);
- if(sortColumn != -1){
- var sortDir = state.direction;
- var sc = this.sortClasses;
- var hds = this.el.select(this.headerSelector).removeClass(sc);
- hds.item(sortColumn).addClass(sc[sortDir == "DESC" ? 1 : 0]);
+
+ // sort state can be single { field: xxx, direction : yyy}
+ // or { xxx=>ASC , yyy : DESC ..... }
+
+ var mstate = {};
+ if (!this.ds.multiSort) {
+ var state = this.ds.getSortState();
+ if(!state){
+ return;
+ }
+ mstate[state.field] = state.direction;
+ // FIXME... - this is not used here.. but might be elsewhere..
+ this.sortState = state;
+
+ } else {
+ mstate = this.ds.sortToggle;
+ }
+ //remove existing sort classes..
+
+ var sc = this.sortClasses;
+ var hds = this.el.select(this.headerSelector).removeClass(sc);
+
+ for(var f in mstate) {
+
+ var sortColumn = this.cm.findColumnIndex(f);
+
+ if(sortColumn != -1){
+ var sortDir = mstate[f];
+ hds.item(sortColumn).addClass(sc[sortDir == "DESC" ? 1 : 0]);
+ }
}
+
+
+
},
- handleHeaderClick : function(g, index){
+
+ handleHeaderClick : function(g, index,e){
+
+ Roo.log("header click");
+
+ if (Roo.isTouch) {
+ // touch events on header are handled by context
+ this.handleHdCtx(g,index,e);
+ return;
+ }
+
+
if(this.headersDisabled){
return;
}
var dm = g.dataSource, cm = g.colModel;
- if(!cm.isSortable(index)){
+ if(!cm.isSortable(index)){
return;
}
- g.stopEditing();
+ g.stopEditing();
+
+ if (dm.multiSort) {
+ // update the sortOrder
+ var so = [];
+ for(var i = 0; i < cm.config.length; i++ ) {
+
+ if ((typeof(dm.sortToggle[cm.config[i].dataIndex]) == 'undefined') && (index != i)) {
+ continue; // dont' bother, it's not in sort list or being set.
+ }
+
+ so.push(cm.config[i].dataIndex);
+ };
+ dm.sortOrder = so;
+ }
+
+
dm.sort(cm.getDataIndex(index));
},
cm.setLocked(index, false);
}
break;
+ case 'wider': // used to expand cols on touch..
+ case 'narrow':
+ var cw = cm.getColumnWidth(index);
+ cw += (item.id == 'wider' ? 1 : -1) * 50;
+ cw = Math.max(0, cw);
+ cw = Math.min(cw,4000);
+ cm.setColumnWidth(index, cw);
+ break;
+
default:
index = cm.getIndexById(item.id.substr(4));
if(index != -1){
{id:"unlock", text: this.unlockText, cls: "xg-hmenu-unlock"}
);
}
+ if (Roo.isTouch) {
+ this.hmenu.add('-',
+ {id:"wider", text: this.columnsWiderText},
+ {id:"narrow", text: this.columnsNarrowText }
+ );
+
+
+ }
+
if(this.grid.enableColumnHide !== false){
this.colMenu = new Roo.menu.Menu({id:this.grid.id + "-hcols-menu"});
this.dd = new Roo.grid.GridDragZone(this.grid, {
ddGroup : this.grid.ddGroup || 'GridDD'
});
+
}
/*
sortDescText : "Sort Descending",
lockText : "Lock Column",
unlockText : "Unlock Column",
- columnsText : "Columns"
+ columnsText : "Columns",
+
+ columnsWiderText : "Wider",
+ columnsNarrowText : "Thinner"
});