PDA

View Full Version : Grid CellActions Plugin



Pages : 1 [2]

MoimHossain
2 Jun 2010, 7:51 AM
Folks, I am new to ExtJs. But enjoying so much working with this.

Today I am trying to implement a grid that will display some files. I want to display file ICON before the file name.
For example, it can be text file, then I will display a text file image icon, or it could be an image file and so on.

Also I need to do some actions after clicking on that Icon.

I found the RowActions plugin by Saki (the Lord :) ) quite interesting and helpful. Implemented that also. But I uses a CSS to generate the ICONs. But in my case it will be dynamic for each row data. And there could be many different extensions of files found into the system, I want to display into the grid, so I need to change the image in rows programmatic way. Also, I have seen that using this RowActions, I can see the column name onto the Column Hide/Unhide context menu of the grid, which I don't know how to turn off.

Then considered the CellActions, and it seemed a bit more closer to my requirement. Only problem is it also uses the CSS to generate the image. Also noticed that it changed the grid 's selection model to cell. Is it a default behavior or I can change it back to Row selection mode?

Any body please suggest me on this issue, it would be very helpful for me to understand and learn these plugin into such cool ExtJs framework.

Thanks in advance :)

jsakalos
2 Jun 2010, 9:34 AM
I would use RowActions if you have one file per row. FYI, CellActions do not affect the selection model used in any way - they are selection model agnostic.

MoimHossain
2 Jun 2010, 9:47 AM
I would use RowActions if you have one file per row. FYI, CellActions do not affect the selection model used in any way - they are selection model agnostic.

How can I change images for each row using RowActions..?
Thanks a lot for the reply BTW:)

jsakalos
2 Jun 2010, 10:24 AM
RTFM please - watch iconIndex.

MoimHossain
2 Jun 2010, 10:41 AM
Ha ha ha, I will RTFM sir...Never mind .

Thanks for your help again mate :)

MoimHossain
4 Jun 2010, 12:21 AM
Saki, I need your suggestion once more on this issue :)

I used the IconIndex and now I have different images for my actions, this is cool. But I noticed that after doing this, the Callback that I initialized before, is not working anymore. Any idea Sir ? :)

What I did is as follows :



// The action click handler
function viewPropertiesClickHandler(grid, record, action, rowIndex, colIndex) {
alert('Write code to show properties for ' + record.get('Name'));
}

// The action click handler
function downloadClickHandler(grid, record, action, rowIndex, colIndex) {
alert('Write code to download ' + record.get('Name'));
}



var actionItems = new Array();
actionItems.push({
iconIndex: 'statusIcon',
qtipIndex: 'statusQtip',
callback: viewPropertiesClickHandler
});


actionItems.push({
iconCls: 'downloadFile',
tooltip: 'Download Document',
callback: downloadClickHandler
});


var _action = new Ext.ux.grid.RowActions({
header: 'Actions',
width: 40,
//autoWidth: false,
hideMode: 'display',
keepSelection: true,
actions: actionItems,
getData: function(value, cell, record) {

var imageCssName = record.get('iconclassName');
return {
statusIcon: imageCssName,
statusQtip : 'View properties'
}
}
});

As you can see here, I have two actions, one for view the properties (where I used the IconIndex trick to change the file icons) and the section one is for downloading the document (without any IconIndex trick, simply using IconCls).

Now if I select the download icon, I can see the alter, but the first one does n't do any thing. Could you please tell me what I am doing wrong.

Your responses are much appreciated Man!

Mr.Gray
8 Jun 2010, 4:24 AM
Is there any chance to see this plugin adapted to ExtJs 3.x?

Mr.Gray
8 Jun 2010, 6:02 AM
Please, disregard my previous question. The plugin works just perfectly with ExtJs 3.x.

jsakalos
8 Jun 2010, 10:17 AM
What if you comment out getData method?

klepina
15 Jun 2010, 11:38 PM
DoublePost

klepina
15 Jun 2010, 11:40 PM
Good day, I have a strange bug with Ext 3.2.1 & CellActions
When used GridEditor, the value of editable field always become value of last field in grid, which uses CellAction
All shown on scren below

http://xmages.net/storage/10/1/0/e/4/upload/7a9adc9a.gif

jsakalos
16 Jun 2010, 12:48 PM
Never had this problem. Try to remove CellActions if the grid w/o 'em works fine, then add them to see if the ux is causing the problem.

klepina
25 Jun 2010, 6:22 AM
I've solved this problem, the solution is never to use grid store field with name "value", it's strange, but it works.

pipiet06
3 Oct 2010, 6:01 PM
Hi Saki...
thanks for created cellaction plugin.

is it possible to used your plugin without icon?

jsakalos
4 Oct 2010, 1:04 AM
I've never tried because a simple custom renderer with a link and handler is enough in that case.

dstrr
26 Nov 2010, 1:11 AM
Hi!
Thank you for doing such useful plugin!

I have question about way to conditional show of cell action icon.
A context sound like this:
There is number field, in case when field value is zero, icon is not to be shown.
In case when field value greater than zero, icon is to be shown.

Alternative way when there is two icons: red and green, if 0 then show green icon, otherwise show red icon.

How can I hide (or switch cell action) depending on record field value?

One more question, how can I override cell action template to show number field value "inside" of image of action icon, for case when value >0?

Thank you!

jsakalos
30 Nov 2010, 9:51 AM
There is hideIndex config property that you can use for it.

enoal
1 Dec 2010, 6:43 AM
Hi Saki,

I have a grid with 3 ColumnModel depending on the action choosed by the user.

In each ColumnModel, the first column has a "more info" action.

The default ColumnModel renders correctly but when the user selects another action - and another ColumnModel - the CellActions are not rendered.

Regards

jsakalos
1 Dec 2010, 10:44 AM
I'm not sure that this can work. CellActions is a plugin that is initialize only once per grid. Perhaps the easier way is to go for 3 separate grids in a card layout each with its own col model.

urfrd_dipak
19 Dec 2010, 11:01 PM
Hello,

I am using extjs grid with delete and edit action but it is not working.

Please help me and give me some suggestion.

Thanks

herist
30 Jul 2011, 5:16 PM
Hi?
I found the CellAction column has a text-overflow problem in IE 6.
I use extjs 3.2 .
http://www.sencha.com/forum/images/misc/paperclip.png Attached Images http://www.sencha.com/forum/attachment.php?attachmentid=27209&stc=1&d=1311931800

hunterbcn
11 Aug 2011, 8:59 AM
Hi,

CellActions plugin works on Ext JS 4.x?

Thanks in advance

pludikhu
23 Oct 2011, 10:51 AM
Hi Saki, is this still thread still supported?

I've been using cell actions with 3.2.1 but as soon as I switch to 3.4.0, the qtips are gone.
Any idea how come? When I switch back to 3.2.1 they re-appear ... even on your downloaded code.

As always: your help and assistance are greatly appreciated. Thank you!

Patrick

B.t.w. for those who just want a cell with icons and no text, be sure to at least but a non blanking space (& # 160 ; - without the spaces) otherwise the cell action icons will only partially display.

bart
24 Oct 2011, 3:10 AM
Hi Saki, is this still thread still supported?

I've been using cell actions with 3.2.1 but as soon as I switch to 3.4.0, the qtips are gone.
Any idea how come? When I switch back to 3.2.1 they re-appear ... even on your downloaded code.


I had the same problem today and I managed to resolve it.

You should just change:


qtip="{qtip}"

to


ext:qtip="{qtip}"

ln. 167 in Ext.ux.grid.CellActions.js

pludikhu
24 Oct 2011, 7:34 AM
I had the same problem today and I managed to resolve it.

You should just change:


qtip="{qtip}"

to


ext:qtip="{qtip}"

ln. 167 in Ext.ux.grid.CellActions.js

You sir, are fantastic ;-)

It works like a charm; thank you very much!