0

レンダラーを使用して1列にチェックボックスを配置し、別の列にラジオボタンを配置する2列を持つEXT JS 4.2グリッドがあります。これらの HTML 入力の ID を自動インクリメントして、EXT JS を介して具体的にターゲットにできるようにするにはどうすればよいですか (「フル」列と「プライマリ」列を参照)。

    // Render library grid
var grid4 = Ext.create('Ext.grid.Panel', {
    xtype: 'gridpanel',
    id:'button-grid',
    store: data,
    columns: [
        {text: "Library", width: 170, sortable: true, dataIndex: 'name'},
        {text: "Market", width: 125, sortable: true, dataIndex: 'market'},
        {text: "Expertise", width: 125, sortable: true, dataIndex: 'expertise'},
        {text: 'Full', dataIndex:'isFull', renderer: function() {
            var rec = grid4.getStore().getAt(this.rowIndex);
            return "<input type='checkbox' id='"+rec+"' />";
        }},
        {text: 'Primary', dataIndex:'isPrimary', renderer: function() {
            return "<input type='radio' />";
        }},
    ],

    columnLines: false,
    selModel: selModel,

    // inline buttons
    dockedItems: [{
        xtype: 'toolbar',
        dock: 'bottom',
        ui: 'footer',
        layout: {
            pack: 'center'
        },
        items: []
    }, {
        xtype: 'toolbar',
        items: []
    }],

    width: 600,
    height: 300,
    frame: true,
    title: 'Available Libraries',
    iconCls: 'icon-grid',
    renderTo: Ext.get('library-grid')
});

更新: ID が増えています。ありがとうございます。

ここで、もう 1 つ質問があります。EXT グリッドの項目をチェックするときに、checked:checked フラグが設定されていません。以下のコードのようなことをするにはどうすればよいでしょうか。要素がチェックされているかどうかを確認したい

                    if(document.getElementById("#isFull-"+record['index']+"").checked == true){
                    var myVar = true;
                }
4

1 に答える 1

2

は一連のrenderer引数を自動的に取ります。そのうちの 1 つが rowIndex です。これを実行して、必要な一意の ID を付与できるはずです。

{
    text: 'Full', 
    dataIndex:'isFull', 
    renderer: function(value, meta, record, rowIndex, colIndex) 
    {
        return '<input type="checkbox" id="isFull-' + rowIndex + '" />';
    }
}

詳細はこちら: http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.column.Column-cfg-renderer

于 2013-07-23T18:57:10.280 に答える