foxmarco
27 Sep 2010, 4:29 AM
Ext.ux.grid.ProfileRowActions [v1.0]
Hallo Extjs World,
this is my first "extend" object that post in this forum. I've started to develop this object from RowActions (Saki) with the target of profile the visible of the buttons (action) per user profile.
This is the code:
Ext.ns(
'Ext.ux.grid');
/**
* Creates new RowActions plugin
* @constructor
* @param {Object} config A config object
*/
Ext.ux.grid.ProfileRowActions =
function(config) {
Ext.apply(this, config);
// call parent
Ext.ux.grid.ProfileRowActions.superclass.constructor.call(
this);
}
;
Ext.extend(Ext.ux.grid.ProfileRowActions, Ext.ux.grid.RowActions, {
//id toolbar action
idRowAction: null
//url profile
,url : null
//parameters extra
,extra : null
//field store
,fields : null
//store profile
,store : null
// methods
/**
* Init function
*/
,init:function(grid) {
//Minimal fields
if (this.fields == null) {
this.fields = ['id'];
}
this.store = new Ext.data.JsonStore({
scope:this,
fields: this.fields,
proxy: new Ext.data.HttpProxy({
url : this.url
}),
root: 'data' ,
baseParams : {id: this.idRowAction}
}
);
//extra parameters
if (this.extra != null) {
this
.store.baseParams = Ext.apply(this.store.baseParams, this.extra);
}
//load dati
this.store.load();
//event store
this.store.on('load', this.onLoad.createDelegate(this, [grid]), this);
}
//store load event
,onLoad: function(grid){
var
records = this.store.data.items
var itemsCopy = new Ext.util.MixedCollection();
Ext.each(this.actions, function(a, i) {
itemsCopy.add(a);
});
//clean orginal actions
this.actions = new Array();
for(var i=0, len=itemsCopy.length; i<len; i++){
var idSearch = itemsCopy.get(i).id;
for (var j=0, lenRecord=records.length; j<lenRecord; j++){
var idActive = records[j].data.id
if (idSearch == idActive) {
this.actions.push(itemsCopy.get(i));
break;
}
}
//j
}//i
//super init
Ext.ux.grid.ProfileRowActions.superclass.init.apply(this, arguments);
//Cell width
this.autoWidthAction(grid);
}
//private
,autoWidthAction: function(grid) {
//Ridimensionamento header action
var cm = grid.colModel;
var el = grid.getView().getHeaderCell(cm.getColumnCount(true) - 1), width, rowIndex, count;
el = el.firstChild;
el.style.width = '0px';
width = el.scrollWidth;
el.style.width = 'auto';
for (rowIndex = 0, count = grid.getStore().getCount(); rowIndex < count; rowIndex++) {
el = grid.getView().getCell(rowIndex, cm.getColumnCount(true) - 1).firstChild;
el.style.width = '0px';
width = Math.max(width, el.scrollWidth);
el.style.width = 'auto';
}
grid.getView().onColumnSplitterMoved(cm.getColumnCount(true) - 1, this.width);
grid.getView().refresh(true);
}
}
);
// registre xtype
Ext.reg(
'profilerowactions', Ext.ux.grid.ProfileRowActions);
// eof
... example of use:
// Create RowActions Plugin
var action = new Ext.ux.grid.ProfileRowActions({
idRowAction: 'rowactionfm',
extra: {aliasBar: 'fm'},
url: 'loadButtonsController.do',
header:'Actions',
autoWidth: true,
actions:[{
id: 'eb',
iconCls:'icon-edit',
qtip:'Edit,
callback:function(grid, records, action, groupId) {
var
id = records.data.codFormaTecnica;
document.location = 'viewListFormaTecnica.do?execution=' + flowExecutionKey + '&_eventId=edit&idCurrent=' + id;
}
}
]
});
I'm sure there are better solutions with the correct use of JS in my code (if someone is able to use Sequence(Interecept you're welcome..), but this solution works and is really usefull.
I hope you excuse me for my english, and i hope this "extend" version of RowAction could be usefull for someone.
Any comment and critiques are welcome.
Hallo Extjs World,
this is my first "extend" object that post in this forum. I've started to develop this object from RowActions (Saki) with the target of profile the visible of the buttons (action) per user profile.
This is the code:
Ext.ns(
'Ext.ux.grid');
/**
* Creates new RowActions plugin
* @constructor
* @param {Object} config A config object
*/
Ext.ux.grid.ProfileRowActions =
function(config) {
Ext.apply(this, config);
// call parent
Ext.ux.grid.ProfileRowActions.superclass.constructor.call(
this);
}
;
Ext.extend(Ext.ux.grid.ProfileRowActions, Ext.ux.grid.RowActions, {
//id toolbar action
idRowAction: null
//url profile
,url : null
//parameters extra
,extra : null
//field store
,fields : null
//store profile
,store : null
// methods
/**
* Init function
*/
,init:function(grid) {
//Minimal fields
if (this.fields == null) {
this.fields = ['id'];
}
this.store = new Ext.data.JsonStore({
scope:this,
fields: this.fields,
proxy: new Ext.data.HttpProxy({
url : this.url
}),
root: 'data' ,
baseParams : {id: this.idRowAction}
}
);
//extra parameters
if (this.extra != null) {
this
.store.baseParams = Ext.apply(this.store.baseParams, this.extra);
}
//load dati
this.store.load();
//event store
this.store.on('load', this.onLoad.createDelegate(this, [grid]), this);
}
//store load event
,onLoad: function(grid){
var
records = this.store.data.items
var itemsCopy = new Ext.util.MixedCollection();
Ext.each(this.actions, function(a, i) {
itemsCopy.add(a);
});
//clean orginal actions
this.actions = new Array();
for(var i=0, len=itemsCopy.length; i<len; i++){
var idSearch = itemsCopy.get(i).id;
for (var j=0, lenRecord=records.length; j<lenRecord; j++){
var idActive = records[j].data.id
if (idSearch == idActive) {
this.actions.push(itemsCopy.get(i));
break;
}
}
//j
}//i
//super init
Ext.ux.grid.ProfileRowActions.superclass.init.apply(this, arguments);
//Cell width
this.autoWidthAction(grid);
}
//private
,autoWidthAction: function(grid) {
//Ridimensionamento header action
var cm = grid.colModel;
var el = grid.getView().getHeaderCell(cm.getColumnCount(true) - 1), width, rowIndex, count;
el = el.firstChild;
el.style.width = '0px';
width = el.scrollWidth;
el.style.width = 'auto';
for (rowIndex = 0, count = grid.getStore().getCount(); rowIndex < count; rowIndex++) {
el = grid.getView().getCell(rowIndex, cm.getColumnCount(true) - 1).firstChild;
el.style.width = '0px';
width = Math.max(width, el.scrollWidth);
el.style.width = 'auto';
}
grid.getView().onColumnSplitterMoved(cm.getColumnCount(true) - 1, this.width);
grid.getView().refresh(true);
}
}
);
// registre xtype
Ext.reg(
'profilerowactions', Ext.ux.grid.ProfileRowActions);
// eof
... example of use:
// Create RowActions Plugin
var action = new Ext.ux.grid.ProfileRowActions({
idRowAction: 'rowactionfm',
extra: {aliasBar: 'fm'},
url: 'loadButtonsController.do',
header:'Actions',
autoWidth: true,
actions:[{
id: 'eb',
iconCls:'icon-edit',
qtip:'Edit,
callback:function(grid, records, action, groupId) {
var
id = records.data.codFormaTecnica;
document.location = 'viewListFormaTecnica.do?execution=' + flowExecutionKey + '&_eventId=edit&idCurrent=' + id;
}
}
]
});
I'm sure there are better solutions with the correct use of JS in my code (if someone is able to use Sequence(Interecept you're welcome..), but this solution works and is really usefull.
I hope you excuse me for my english, and i hope this "extend" version of RowAction could be usefull for someone.
Any comment and critiques are welcome.