ExtJS 4 actioncolumn Ausgabe

Question

Ich habe eine Ext.grid.Panel mit diesem Artikel:

items:[ 
        { 
          xtype:'actioncolumn', 
          width:20, 
          align:'center', 
          items: [ 
            { 
             icon:'resources/images/icons/table_edit.png', 
             tooltip: 'Edita Registro', 
             action:'edit' 
            }, 
          ] 
        }, 
        {header:'<span style="color:blue;">Estado</span>', dataIndex:'testado', width:90}, 
        {header:'<span style="color:blue;">Cliente</span>', dataIndex:'tcliente', width:110, sortable: true}, 
        {header:'<span style="color:blue;">N&#176; Expediente</span>', dataIndex:'Expediente', width:100}, 
        {header:'<span style="color:blue;">Organismo</span>', dataIndex:'torganismo', width:255, sortable: true}, 
        {header:'<span style="color:blue;">Convocatoria</span>', dataIndex:'F_Convocatoria', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Presentacion</span>', dataIndex:'F_Presentacion', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Aviso</span>', dataIndex:'F_Aviso', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Importe sin IVA</span>', dataIndex:'Total_Licitacion_sIVA', width:105, sortable: true}, 
        {header:'<span style="color:blue;">Responsable</span>', dataIndex:'tresponsable', width:140, sortable: true}, 
      ] 

In meinem Controller ich, wenn der Benutzer klickt auf die Schaltfläche des actioncolumn zur Hand wollen. Ich habe den folgenden Code:

this.control({ 
    'viewGridRECO actioncolumn':{ 
     click:this.onPulsarEditar 
    } 
}); 

Mit dem vorherigen Code in meinem Controller, die Funktion onPulsarEditar ausführt, wenn der Benutzer überall in der Zelle der Spalte Aktion klickt, aber ich will es nur, wenn Sie auf der Schaltfläche ausführen nicht überall in der Zelle der Aktionssäule.

Ich habe versucht, action:'edit' Eigenschaft in der Schaltfläche zu setzen und in der Steuerung:

this.control({ 
    'viewGridRECO actioncolumn button[action=edit]':{ 
     click:this.onPulsarEditar 
    } 
}); 

Und nichts happends.

Answer 1

Als @Abdul Rehman Yawar Khan comented this Beitrag ansehen, nach meinem Code aktualisieren es ist:

In der Ansicht, die column items:

items:[ 
        { 
          xtype:'actioncolumn', 
          width:20, 
          align:'center', 
          items: [ 
            { 
             icon:'resources/images/icons/table_edit.png', 
             tooltip: 'Edita Registro', 
             handler: function(view, rowIndex, colIndex, item, e, record, row) { 
              this.fireEvent('itemClick', view, rowIndex, colIndex, item, e, record, row, 'edit'); 
             } 
            } 
          ] 
        }, 
        {header:'<span style="color:blue;">Estado</span>', dataIndex:'testado', width:90}, 
        {header:'<span style="color:blue;">Cliente</span>', dataIndex:'tcliente', width:110, sortable: true}, 
        {header:'<span style="color:blue;">N&#176; Expediente</span>', dataIndex:'Expediente', width:100}, 
        {header:'<span style="color:blue;">Organismo</span>', dataIndex:'torganismo', width:255, sortable: true}, 
        {header:'<span style="color:blue;">Convocatoria</span>', dataIndex:'F_Convocatoria', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Presentacion</span>', dataIndex:'F_Presentacion', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Aviso</span>', dataIndex:'F_Aviso', width:80, sortable: true}, 
        {header:'<span style="color:blue;">Importe sin IVA</span>', dataIndex:'Total_Licitacion_sIVA', width:105, sortable: true}, 
        {header:'<span style="color:blue;">Responsable</span>', dataIndex:'tresponsable', width:140, sortable: true}, 
      ] 

In der Steuerung:

this.control({ 
    'actioncolumn':{ 
     itemClick:this.onPulsarEditar 
}); 

Beachten Sie, dass itemClick von actioncolumn im Controller wird genauso geschrieben wie im View-Handler-Event.

Und in der Steuerung in der Funktion onPulsarEdit können Sie den gesamten Code hinzufügen, den Sie benötigen, um die Funktion auszuführen, wie Sie wollen.