急!请教:
我将一个已经存在的html,直接转换成ext的样式,但是为什么我用Ext.get("the-table")得到的是null?"the-table"是原来html的table的id,还有的问题就是,我原来用js写的一些对table的操作现在都不能使用会报错,请问应该做哪些相应的修改?小弟只有16分了,给15分
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>From Markup Grid Example</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<!-- GC -->
  <!-- LIBS -->
  <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
  <!-- ENDLIBS --><script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="from-up.js"></script>
<link rel="stylesheet" type="text/css" href="grid-examples.css" />
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../shared/examples.css" />
<style type="text/css">
#the-table { border:1px solid #bbb;border-collapse:collapse; }
#the-table td,#the-table th { border:1px solid #ccc;border-collapse:collapse;padding:5px; }
</style>
</head>
<body>
<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
<h1>From Markup Grid Example</h1>
<p>This example shows how to create a grid with from an existing, unformatted HTML table.</p>
<p>Note that the js is not minified so it is readable. See <a href="from-up.js">from-up.js</a>.</p>
<button id="create-grid" type="button">Create grid</button>
<br />
<br />
<table cellspacing="0" id="the-table">
        <thead>
            <tr style="background:#eeeeee;">
                <th>Name</th>
                <th>Age</th>
                <th>Sex</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Barney Rubble</td>
                <td>32</td>
                <td>Male</td>
            </tr>
            <tr>
                <td>Fred Flintstone</td>
                <td>33</td>
                <td>Male</td>
            </tr>
            <tr>
                <td>Betty Rubble</td>
                <td>32</td>
                <td>Female</td>
            </tr>
            <tr>
                <td>Pebbles</td>
                <td>1</td>
                <td>Female</td>
            </tr>
            <tr>
                <td>Bamm Bamm</td>
                <td>2</td>
                <td>Male</td>
            </tr>
        </tbody>
    </table></body>
</html>转换table的from-up.js:Ext.onReady(function() {
  var btn = Ext.get("create-grid");
  btn.on("click", function(){
    btn.dom.disabled = true;    // create the grid
    var grid = new Ext.grid.TableGrid("the-table", {
      stripeRows: true // stripe alternate rows
    });
    grid.render();
alert(Ext.get("the-table"));
  }, false, {single:true}); // run once
});Ext.grid.TableGrid = function(table, config) {
  config = config || {};
  Ext.apply(this, config);
  var cf = config.fields || [], ch = config.columns || [];
  table = Ext.get(table);  var ct = table.insertSibling();  var fields = [], cols = [];
  var headers = table.query("thead th");
  for (var i = 0, h; h = headers[i]; i++) {
    var text = h.innerHTML;
    var name = 'tcol-'+i;    fields.push(Ext.applyIf(cf[i] || {}, {
      name: name,
      mapping: 'td:nth('+(i+1)+')/@innerHTML'
    }));    cols.push(Ext.applyIf(ch[i] || {}, {
      'header': text,
      'dataIndex': name,
      'width': h.offsetWidth,
      'tooltip': h.title,
      'sortable': true
    }));
  }  var ds  = new Ext.data.Store({
    reader: new Ext.data.XmlReader({
      record:'tbody tr'
    }, fields)
  });  ds.loadData(table.dom);  var cm = new Ext.grid.ColumnModel(cols);  if (config.width || config.height) {
    ct.setSize(config.width || 'auto', config.height || 'auto');
  } else {
    ct.setWidth(table.getWidth());
  }  if (config.remove !== false) {
    table.remove();
  }  Ext.applyIf(this, {
    'ds': ds,
    'cm': cm,
    'sm': new Ext.grid.RowSelectionModel(),
    autoHeight: true,
    autoWidth: false
  });
  Ext.grid.TableGrid.superclass.constructor.call(this, ct, {});
};Ext.extend(Ext.grid.TableGrid, Ext.grid.GridPanel);