Ext.onReady(function() {
            var sm = new Ext.grid.CheckboxSelectionModel();
            var cm = new Ext.grid.ColumnModel([
            new Ext.grid.RowNumberer(),
            sm,
            { header: '编号', dataIndex: 'id', sortable: true, width: 30 },
            { header: '名称', dataIndex: 'name', width: 50 },
            { header: '性别', dataIndex: 'sex', renderer: function(value) { //根据value判断输出值及格式
                if (value == 'male') {
                    return "<span style=color:blue>男</span>";
                }
                else {
                    return "<span style=color:red>女</span><img src='Img/girl.jpg' />";
                }
            }
            },
            { header: '描述', dataIndex: 'descn' },
            { header: '日期', dataIndex: 'date', type: 'date', renderer: Ext.util.Format.dateRenderer('m/d/Y') },
            { header: '详情', dataIndex: 'xiang', renderer: function() {
                return "<input id='Button1' type='button' value='详情'";
            }
            }
            ]);            var myData = [
            ['1', 'wangchao', 'male', '100', '9/1 12:00am'],
            ['2', 'wanghai', 'female', '90', '9/1 12:00am'],
            ['3', 'haohao', 'male', '80', '9/1 12:00am']
            ];            var store = new Ext.data.Store(
            {
                proxy: new Ext.data.MemoryProxy(myData),
                reader: new Ext.data.ArrayReader({}, [
                { name: 'id' },
                { name: 'name' },
                { name: 'sex' },
                { name: 'descn' },
                { name: 'date', type: 'date', dateFormat: 'n/j h:ia'}])
            });            store.load();
            var grid = new Ext.grid.GridPanel({
                store: store,
                cm: cm,
                sm: sm,
                height: 350,
                width: 800,
                stripeRows: true, 
                loadMask: true,
                viewConfig: { forceFit: true  
                }
            });
        })我按照书上的写的var sm = new Ext.grid.CheckboxSelectionModel();想在grid中出一个checkbox,但是总是出不来,请问是我哪里写错了??

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>test1.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
        <link rel="stylesheet" type="text/css" href="ext-2.2/resources/css/ext-all.css" />
        <script type="text/javascript" src="ext-2.2/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="ext-2.2/ext-all.js"></script>
    <script type="text/javascript">
    Ext.onReady(function() {
      var sm = new Ext.grid.CheckboxSelectionModel();
      var cm = new Ext.grid.ColumnModel([
      new Ext.grid.RowNumberer(),
      sm,
      { header: '编号', dataIndex: 'id', sortable: true, width: 30 },
      { header: '名称', dataIndex: 'name', width: 50 },
      { header: '性别', dataIndex: 'sex', renderer: function(value) { //根据value判断输出值及格式
      if (value == 'male') {
      return "<span style=color:blue>男</span>";
      }
      else {
      return "<span style=color:red>女</span><img src='Img/girl.jpg' />";
      }
      }
      },
      { header: '描述', dataIndex: 'descn' },
      { header: '日期', dataIndex: 'date', type: 'date', renderer: Ext.util.Format.dateRenderer('m/d/Y') },
      { header: '详情', dataIndex: 'xiang', renderer: function() {
      return "<input id='Button1' type='button' value='详情'";
      }
      }
      ]);

      var myData = [
      ['1', 'wangchao', 'male', '100', '9/1 12:00am'],
      ['2', 'wanghai', 'female', '90', '9/1 12:00am'],
      ['3', 'haohao', 'male', '80', '9/1 12:00am']
      ];

      var store = new Ext.data.Store(
      {
      proxy: new Ext.data.MemoryProxy(myData),
      reader: new Ext.data.ArrayReader({}, [
      { name: 'id' },
      { name: 'name' },
      { name: 'sex' },
      { name: 'descn' },
      { name: 'date', type: 'date', dateFormat: 'n/j h:ia'}])
      });

      store.load();
      var grid = new Ext.grid.GridPanel({
      renderTo: Ext.getBody(),//你写好了就差最关键一步,没有渲染。加这个就可以了,在body中显示
      title: "grid",
      frame: true,
      store: store,
      cm: cm,
      sm: sm,
      height: 350,
      width: 800,
      stripeRows: true, 
      loadMask: true,
      viewConfig: { forceFit: true  
      }
      });
      })
    </script>
      </head>
      
      <body>
      </body>
    </html>
      

  2.   

    renderTo: Ext.getBody(),这句渲染加了,但是checkbox还是没有
      

  3.   

    我这边有,你看看导入了css样式没有;css样式图片全不全
    代码没有问题