PDA

View Full Version : Ext.ux.plugins.ViewPickSelect



cchiriac
4 Mar 2011, 2:54 AM
Hi all,

I have writtem a small plugin for Ext.DataView providing a different selection behaviour for mouse click event. It does this:
- multiple selection is performed on click
- toggles a node's selection on click

It works ok for me on both singleSelect: true and multiSelect: true.


Here is the code:


// create namespace for plugins
Ext.namespace('Ext.ux.plugins');

/**
* Adapted from tutorial class:
* Ext.ux.plugins.IconCombo plugin for Ext.form.Combobox
*
* Found at:
* http://www.sencha.com/learn/Tutorial:Writing_Ext_2_Plugins
*
* Plugin for Ext.DataView allowing to pick the selections in the view.
* It allows to toggle selection of a node on click.
*
* If multiSelect is true, clicking on a unselected node, selects it, without
* performing clearSelections.
*
* @class Ext.ux.plugins.ViewPickSelect
* @extends Ext.util.Observable
*/
Ext.ux.plugins.ViewPickSelect = function(config) {
Ext.apply(this, config);
};

// plugin code
Ext.extend(Ext.ux.plugins.ViewPickSelect, Ext.util.Observable, {
init:function(view) {
Ext.apply(view, {
// private
onItemClick : function(item, index, e){
if(this.fireEvent("beforeclick", this, index, item, e) === false){
return false;
}

this.doPickSelection(item, index, e);
e.preventDefault();
return true;
},

// private
doPickSelection : function(item, index, e){
if(e.shiftKey && this.last !== false && this.multiSelect){
var last = this.last;
this.selectRange(last, index, e.ctrlKey);
this.last = last; // reset the last
}else{
if(this.isSelected(index)){
this.deselect(index);
}else{
this.select(index, this.multiSelect);
}
}
}
});
} // end of function init
}); // end of extend

// end of file

I have tested on Firefox 3.6.14 and Safari 4 on Windows.

cchiriac
14 Mar 2011, 9:45 AM
Sorry folks,

I just read again the docs. All I needed was the simpleSelect confg.
This does it for me:


multiSelect: true,
singleSelect : false,
simpleSelect : true,