ExtJS4.2學習(11)可拖放的表格

單純的數據展現是否是太單調了？來，此次咱來個互動性強的，表格的行、列可隨意拖放，不只如此，還能夠多個表格之間隨意拖動。
先來看下第一個例子，經過拖放改變表格大小：

主要代碼，其實以前的代碼並不須要改變多少，只須要加入如下代碼便可：

var columns = [ 
      {header:'編號',dataIndex:'id'}, 
      {header:'名稱',dataIndex:'name'}, 
      {header:'描述',dataIndex:'descn'} 
  ]; 
      
  var data = [ 
      ['1','name1','descn1'], 
      ['2','name2','descn2'], 
      ['3','name3','descn3'], 
      ['4','name4','descn4'], 
      ['5','name5','descn5'] 
  ]; 
      
  var store = new Ext.data.ArrayStore({ 
data: data, 
fields: [ 
          {name: 'id'}, 
          {name: 'name'}, 
          {name: 'descn'} 
      ] 
  }); 
  store.load(); 
      
  var grid = new Ext.grid.GridPanel({ 
      renderTo: 'grid', 
      store: store, 
      columns: columns 
  });

上效果圖：

好了，本章到此結束，下章開始講擴展插件，等全部擴展插件講完，表格控件就到此結束了，你也來動手試試吧。
連載中，請你們持續關注，本文出自個人我的網站 思考者日記網