iteye_6393
2011-05-14 10:14
浏览 606

如何实现grid禁止选择特定行

用extjs写了个grid,并且有checkboxselectModel,在每一行里,有一列渲染是button。
在点击button时,改变其中某一列的值,并使这一列无法被选择。找了cm和sm的方法,都没有相关方法。请问该如何实现呢?
使用的extjs3.2版本。

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

5条回答 默认 最新

  • suziwen 2011-05-14 11:48
    已采纳

    [code="js"]/*!

    Ext.onReady(function(){

    Ext.QuickTips.init();
    
    var xg = Ext.grid;
    
    // shared reader
    var reader = new Ext.data.ArrayReader({}, [
       {name: 'company'},
       {name: 'price', type: 'float'},
       {name: 'change', type: 'float'},
       {name: 'pctChange', type: 'float'},
       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'},
       {name: 'industry'},
       {name: 'desc'}
    ]);
    
    ////////////////////////////////////////////////////////////////////////////////////////
    // Grid 2
    ////////////////////////////////////////////////////////////////////////////////////////
    var sm = new xg.CheckboxSelectionModel({
      listeners:{
    beforerowselect : function(  _this ,  _rowIndex ,  _keepExisting ,  _record  ) {
       //if()在这里加上业务逻辑,指定哪条数据不让选择中就返回FALSE
       if(_rowIndex == 4){
          return false;
       }else{
         return true;
       }
    }
    
      }
    });
    var grid2 = new xg.GridPanel({
        store: new Ext.data.Store({
            reader: reader,
            data: xg.dummyData
        }),
        cm: new xg.ColumnModel({
            defaults: {
                width: 120,
                sortable: true
            },
            columns: [
                sm,
                {id:'company',header: "Company", width: 200, dataIndex: 'company'},
                {header: "Price", renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
                {header: "Change", dataIndex: 'change'},
                {header: "% Change", dataIndex: 'pctChange'},
                {header: "Last Updated", width: 135, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
            ]
        }),
        sm: sm,
        columnLines: true,
        width:600,
        height:300,
        frame:true,
        title:'Framed with Checkbox Selection and Horizontal Scrolling',
        iconCls:'icon-grid',
        renderTo: document.body,
    bbar:[{
      text:'disable',
      handler:function(){
        //这里的getCell里的4表示第4行,0表示第一列,到时根据你这个SM具体放在哪而定
        var cell = grid2.getView().getCell(4, 0);
                        var checker = Ext.fly(cell.firstChild.firstChild);
                        checker.removeClass('x-grid3-row-checker');
                        checker.addClass('x-grid3-row-unselectable');
      }
    },{
      text:'enable',
      handler:function(){
        var cell = grid2.getView().getCell(4, 0);
                        var checker = Ext.fly(cell.firstChild.firstChild);
                        checker.removeClass('x-grid3-row-unselectable');
                        checker.addClass('x-grid3-row-checker');
      }
    }]
    });
    

    });

    // Array data for the grids
    Ext.grid.dummyData = [
    ['3m Co',71.72,0.02,0.03,'9/1 12:00am', 'Manufacturing'],
    ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am', 'Manufacturing'],
    ['Altria Group Inc',83.81,0.28,0.34,'9/1 12:00am', 'Manufacturing'],
    ['American Express Company',52.55,0.01,0.02,'9/1 12:00am', 'Finance'],
    ['American International Group, Inc.',64.13,0.31,0.49,'9/1 12:00am', 'Services'],
    ['AT&T Inc.',31.61,-0.48,-1.54,'9/1 12:00am', 'Services'],
    ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am', 'Manufacturing'],
    ['Caterpillar Inc.',67.27,0.92,1.39,'9/1 12:00am', 'Services'],
    ['Citigroup, Inc.',49.37,0.02,0.04,'9/1 12:00am', 'Finance'],
    ['E.I. du Pont de Nemours and Company',40.48,0.51,1.28,'9/1 12:00am', 'Manufacturing'],
    ['Exxon Mobil Corp',68.1,-0.43,-0.64,'9/1 12:00am', 'Manufacturing'],
    ['General Electric Company',34.14,-0.08,-0.23,'9/1 12:00am', 'Manufacturing'],
    ['General Motors Corporation',30.27,1.09,3.74,'9/1 12:00am', 'Automotive'],
    ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am', 'Computer'],
    ['Honeywell Intl Inc',38.77,0.05,0.13,'9/1 12:00am', 'Manufacturing'],
    ['Intel Corporation',19.88,0.31,1.58,'9/1 12:00am', 'Computer'],
    ['International Business Machines',81.41,0.44,0.54,'9/1 12:00am', 'Computer'],
    ['Johnson & Johnson',64.72,0.06,0.09,'9/1 12:00am', 'Medical'],
    ['JP Morgan & Chase & Co',45.73,0.07,0.15,'9/1 12:00am', 'Finance'],
    ['McDonald\'s Corporation',36.76,0.86,2.40,'9/1 12:00am', 'Food'],
    ['Merck & Co., Inc.',40.96,0.41,1.01,'9/1 12:00am', 'Medical'],
    ['Microsoft Corporation',25.84,0.14,0.54,'9/1 12:00am', 'Computer'],
    ['Pfizer Inc',27.96,0.4,1.45,'9/1 12:00am', 'Services', 'Medical'],
    ['The Coca-Cola Company',45.07,0.26,0.58,'9/1 12:00am', 'Food'],
    ['The Home Depot, Inc.',34.64,0.35,1.02,'9/1 12:00am', 'Retail'],
    ['The Procter & Gamble Company',61.91,0.01,0.02,'9/1 12:00am', 'Manufacturing'],
    ['United Technologies Corporation',63.26,0.55,0.88,'9/1 12:00am', 'Computer'],
    ['Verizon Communications',35.57,0.39,1.11,'9/1 12:00am', 'Services'],
    ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am', 'Retail'],
    ['Walt Disney Company (The) (Holding Company)',29.89,0.24,0.81,'9/1 12:00am', 'Services']
    ];

    // add in some dummy descriptions
    for(var i = 0; i < Ext.grid.dummyData.length; i++){
    Ext.grid.dummyData[i].push('Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.

    Aliquam commodo ullamcorper erat. Nullam vel justo in neque porttitor laoreet. Aenean lacus dui, consequat eu, adipiscing eget, nonummy non, nisi. Morbi nunc est, dignissim non, ornare sed, luctus eu, massa. Vivamus eget quam. Vivamus tincidunt diam nec urna. Curabitur velit.');
    }[/code]

    打赏 评论
  • cbcgkx 2011-05-14 10:22

    你的要求grid特定行不被选择是可以实现的

    但是你的需求我有点不大理解

    你的意思是这样吗

    正常情况下可以选择行 但是当单击button后 这个行就不可以再被选择了

    还是单击button的时候 行没有被选择

    打赏 评论
  • suziwen 2011-05-14 10:28

    点击BUTTON后,表格要刷新吗?还是你自己改变STORE里的值?

    打赏 评论
  • cbcgkx 2011-05-14 10:52

    beforerowselect : ( SelectionModel this , Number rowIndex , Boolean keepExisting , Record record )
    在选中一行数据之前触发,返回false取消选中
    在选中一行数据之前触发,返回false取消选中
    监听器将会被以如下的参数格式调用:

    this : SelectionModel
    rowIndex : Number
    将要被选择的序号
    keepExisting : Boolean
    False if other selections will be cleared
    record : Record
    将要被选择的记录

    为sm添加事件 跟据你的逻辑 来决定是返回true还是false

    打赏 评论
  • cbcgkx 2011-05-14 10:56

    sm添加事件 listeners:{
    beforerowselect : ( SelectionModel this , Number rowIndex , Boolean keepExisting , Record record )
    if(button被单击过){
    return false;
    }else{
    return true;
    }
    }
    }

    打赏 评论

相关推荐 更多相似问题