그리드의 각 행에 대한 링크 추가

editorgridpanel의 각 행에 대해 '삭제'링크를 표시해야합니다.
이 링크는 상점의 특정 열에 매핑되지 않으므로 어떻게 만드나요?
나는 다음과 같은 시도했지만 추가 된 기록에 대한 링크가 표시되지 않습니다그리드의 각 행에 대한 링크 추가

var sampleRecord = new Ext.data.Record.create([ 
     {mapping: 'organizationId',name:'organizationId', type:'int'}, 
     {mapping: 'name',name:'name', type:'string'}, 
     {mapping: 'address',name:'address' , type:'int'} 
     ]); 

    var s_grid= new Ext.grid.EditorGridPanel ({ 
     ......... 
      columns: [ 
        {header: 'id', width: 120, sortable: false, dataIndex: 'organizationId'}, 
        {header: 'name',width: 120, sortable: false, dataIndex: 'name'}, 
        {header: 'address', sortable: false,width: 45, dataIndex: 'address'}, 
        {header: '',width: 50, sortable: false, renderer:this.delRenderer } 
      ], 
      ..... 
, 
      delRenderer:function (val, meta, rec, rowIdx) { 
       var tempStr="<div onclick=\"javascript:Ext.getCmp('" +"s_grid" + "').deAllocate(" + rowIdx + ");\" class='pointer'><span style='color:#0000FF'><u>Delete</u></span></div>"; 
       return tempStr ; 
      }, 
      deAllocate:function (rowIdx) { 
       Ext.getCmp('s_grid').getStore().removeAt(rowIdx); 
       Ext.getCmp('s_grid').getView().refresh(); 
      } 

      });

도움말이 감사합니다.

출처

2014-02-07 IUnknown

ActionColumn을 사용하는 것이 더 낫습니다. 어쨌든 cellclick 이벤트로 맞춤 요소 (링크 ...)를 해결할 수도 있습니다. 여기에 example 보여주는 두 가지 방법입니다 :

var grid = new Ext.grid.GridPanel({ 
    renderTo: Ext.getBody() 
    ,height: 300 

    ,store: new Ext.data.JsonStore({ 
     fields: ['id', 'name'] 
     ,data: [ 
      {id: 1, name: 'Foo'} 
      ,{id: 2, name: 'Bar'} 
      ,{id: 3, name: 'Baz'} 
     ] 
    }) 

    ,columns: [ 
     {dataIndex: 'name'} 
     ,{ 
      xtype: 'actioncolumn' 
      ,icon: 'http://images.agoramedia.com/everydayhealth/gcms/icon_delete_16px.gif' 
      ,handler: function(grid, row) { 
       grid.store.removeAt(row); 
      } 
     } 
     ,{ 
      renderer: function(value, md, record, row, col, store) { 
       return '<a class="delete-link" href="#delete-record-' + record.id + '">Delete</a>'; 
      } 
     } 
    ] 

    ,listeners: { 
     cellclick: function(grid, row, col, e) { 
      var el = e.getTarget('a.delete-link'); 
      if (el) { 
       e.preventDefault(); 
       grid.store.removeAt(row); 
      } 
     } 
    } 
}); 

var lastId = 3;  
setInterval(function() { 
    var store = grid.store, 
     record = new store.recordType({id: ++lastId, name: 'New record #' + lastId}, lastId); 
    store.add(record); 
}, 3000);

업데이트

을 그리고 그냥 내가 당신의 질문에 주제와 완전하게 될 수 있기 때문에, 당신이 호출 할 때하기 때문에 코드가 작동하지 않는 생각 :

을

renderer: this.delRenderer

this이 그리드를 가리키는 범위에 있지 않습니다 (현재까지 작성되지 않았기 때문에 ...).

출처

2014-02-07 11:30:46 rixo

그리고 matt가 지적한 것처럼 'dataindex' 옵션이 이론적으로 필요합니다. 따라서 작업 열에서 아무 것도 설정하고 싶을 수도 있습니다. 비록 내 피들에서 가시적으로 작동하지만 ... – rixo

삭제 필드 추가하여 모델을 변경할 수 있습니다 일부 modifications.Here가 함께 그런 다음 그리드의 'cellclick'이벤트에 의해 링크를 클릭하십시오 그리드에 여분의 열을 추가하고 확인할 수 있습니다

{ 
     name: 'delete', 
     convert: function() { 
     return '<a href="#">delete</a>'; 
    }

을 실례 : Working Fiddle.

당신 같은 (그래서 그냥 바로 value 인수를 무시가 어떤 분야 (예 : ID)를 제공하고 렌더링 기능으로, dataIndex 설정은 당신의 열을 필요

출처

2014-02-07 11:17:03 Dev

그가 그 보지 않았다 3. – matt

죄송는 ExtJS를 사용하고 고려 ...

var s_grid = new Ext.grid.EditorGridPanel ({ ... columns: [..., { ... renderer: delRenderer }] }); function delRenderer() { // FYI, 'this' will be the column here ... }

또는 그리드의 정의에서 함수를 인라인을 넣어! : 당신이 원하는 것은 오히려이 같은 것입니다 :) – Dev

:-) 좋은 하루 되세요 이미하고있다).

출처

2014-02-07 11:25:40 matt

그리드의 각 행에 대한 링크 추가

답변

관련 문제