View Full Version : row Attachment Action uses same instance of custom grid panel

17 Aug 2011, 3:15 AM
When my form has more than one custom grid then the rowAttachmentActions's on event always fires for last grid in the form.

Below is custom grid code.

function renderLinkAttachment(val) {
return '<a class="gridlink" href="#">' + val + '</a>';

var rowAttachmentActions = new Ext.ux.grid.RowActions({
header: 'Actions',
autoWidth: false,
width: 15,
actions: [{
name: 'delete',
iconCls: 'tDelete',
style: 'width:15px',
tooltip: 'Delete File'

var attachmentColModel = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
header: "File Name",
width: 70,
sortable: true,
dataIndex: 'Name',
renderer: renderLinkAttachment

Ext.ux.grid.Attachment = Ext.extend(Ext.grid.GridPanel, {
// constructor function
constructor: function (config) {
Ext.apply(this, {
id: this.id,
recordId: this.recordId,
attachmentTypeId: this.attachmentTypeId,
processId: this.processId,
colModel: attachmentColModel,
plugins: [rowAttachmentActions],
frame: true,
loadMask: false,
viewConfig: {
forceFit: true
autoHeight: true,
autoWidth: true,
columnLines: true,
enableHdMenu: false,
sm: new Ext.grid.RowSelectionModel({
singleSelect: true
tbar: [{
ref: '../addBtn',
text: 'Add',
id: 'grdAttachmentBtnAdd',
iconCls: 'tNew',
handler: function () {
var attachmentFileDialog = new FileUploadDialog({
owner: this.refOwner
attachmentFileDialog.on('close', function (p) {
if (Ext.isDefined(this.refOwner.attachmentTypeId)) Ext.getCmp('hidAttachmentTypeId').setValue(this.refOwner.attachmentTypeId);
listeners: {
cellclick: function (grid, rowIndex, columnIndex) {
// Get the Record for the row
var record = grid.getStore().getAt(rowIndex);
// Get field name for the column
var fieldName = grid.getColumnModel().getDataIndex(columnIndex);

if (fieldName == 'Name') FileDownload(record.data);
Ext.ux.grid.Attachment.superclass.constructor.apply(this, arguments);

rowAttachmentActions.on('action', function (grid, record) {
title: 'Confirm',
msg: 'Are you sure to delete the selected file?',
buttons: Ext.Msg.YESNOCANCEL,
icon: Ext.Msg.QUESTION,
fn: function (btn) {
if (btn == 'cancel') {
//do something
if (btn == 'yes') {
//do something
FileDelete(record.data, grid);


Grid code used in the form.

var grdAttachment = new Ext.ux.grid.Attachment({
id: "grdAttachment",
store: smrAttachmentStore,
processId: $Constants.ProcessCode,
recordId: Ext.get('id').dom.value,
attachmentTypeId: $Constants.defaultGuid

18 Aug 2011, 2:28 PM
This forum is for ExtJS 4, not 3.

I'm not familiar with Ext.ux.grid.RowActions but from a quick look at your code it seems that you are sharing the same instance of this plugin between all instances of your grid. Each grid will initialize itself with the plugin. My guess would be that this plugin is not intended to be shared in this way and each time it is initialized it overwrites internal references to the grid with the new grid.

Take a look at the plugin's init() method, I imagine it'll reveal all pretty quickly.