[EXT.NET]GridPanel序号宽度自适应

JavaScript:

   <script type="text/javascript">
            var AutoRowNumbererColumn = function () {
                var gridView = Ext.getCmp("ItemGrid").getView();
                var len = Ext.getCmp("ItemGrid").getStore().data.length;
                var text = 0;
                var N = 0;
                N = parseInt(len / 300); //扩大倍数
                for (var i = 0; i < len; i++) {
                    var cellOne = gridView.getCell(i, 0);
                    text = cellOne.textContent; //当前行
                    var oldCellOneWidth = parseInt(cellOne.style.width);
                    var newCellOnewidth = oldCellOneWidth + 5 * N;
                    gridView.getCell(i, 0).style.width = newCellOnewidth + "px";

                }

                var OldOneHeaderWidth = parseInt(gridView.getHeaderCell(1, 0).sytle.width);
                var NewOneHeaderWidth = OldOneHeaderWidth + 5 * N;
                gridView.getHeaderCell(1, 0).sytle.width = NewOneHeaderWidth + 5 * N + "px";

            }

        </script>

HTML:

    <ext:GridPanel ID="ItemGrid" runat="server" StoreID="ItemStore" Width="760" Height="500"
        Title="测试序号宽度自适应" ContextMenuID="Menu1">
        <ColumnModel ID="ColumnModel2" runat="server">
            <Columns>
                <ext:RowNumbererColumn />
                <ext:Column Header="品号" DataIndex="MB001" Width="160" />
                <ext:Column Header="品名" DataIndex="MB002" Width="180" />
                <ext:Column Header="规格" DataIndex="MB003" Width="180" />
            </Columns>
        </ColumnModel>
        <SelectionModel>
            <ext:RowSelectionModel runat="server" ID="r1">
            </ext:RowSelectionModel>
        </SelectionModel>
        <Listeners>
            <ViewReady Handler="AutoRowNumbererColumn();" />
        </Listeners>
    </ext:GridPanel>

 

缺陷：标题无法一起自适应