本人刚开始学习extjs,效果挺好的,但是在学习中遇到了一些问题:
我在grid里添加了一个添加信息按钮,点击后会弹出一个window,window里的formPanel有Textfield元素,问题是我第一次点击的时候是正常的效果,第二次点击的时候textfield失效了,不见了,多方查找未果,特来此求助页面代码如下:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>ExtJS读取数据</title>
       <script src="ext/adapter/ext/ext-base.js" type="text/javascript"></script>
    <script src="ext/ext-all.js" type="text/javascript"></script>
    <link href="ext/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">        Ext.onReady(function() {
            // 列
            var cm = new Ext.grid.ColumnModel([
        { header: 'ID', dataIndex: 'RepairID', sortable: true, width: 10 },
        { header: '名称', dataIndex: 'GroupItemName', sortable: true },
        { header: '设备号', dataIndex: 'GroupItemPhone', sortable: true },
        { header: '维修日期', dataIndex: 'RepairTime', sortable: true, width: 50, renderer: renderDate },   // 在 renderDate 函数中格式化
        {header: '维修内容', dataIndex: 'RepairContent', sortable: true },
        { header: '操作人', dataIndex: 'RepairDriver', sortable: true }
    ]);            // 数据源
            var store = new Ext.data.Store({
                url: 'WebServiceGetData.asmx/GetArticles',    // Web Service 地址
                reader: new Ext.data.XmlReader(
            {
                totalRecords: 'totalRecords',    // 数据总行数。对应于 GetArticles 返回的 DataSet 中的 results 表的 totalRecores 列
                record: 'record',            // 数据。对应于 GetArticles 返回的 DataSet 中的 record 表
                id: 'RepairID'                         // 主键。对应于 GetArticles 返回的 DataSet 中的 record 表的 Id 列
            },
            [
                { name: 'RepairID' },
                { name: 'GroupItemName' },
                { name: 'GroupItemPhone' },
                { name: 'RepairTime' },
                { name: 'RepairContent' },
                { name: 'RepairDriver' }
            ]),
                remoteSort: true                         // 服务端排序
            });
            store.setDefaultSort('RepairID', 'desc');    // 默认按 Date 列降序排列            // 分页栏
            var bbar = new Ext.PagingToolbar(
        {
            pageSize: 10,
            store: store,
            displayInfo: true,
            displayMsg: '当前显示 {0} - {1} 条,共 {2} 条',
            emptyMsg: "暂无数据"
        }
    );            // GridPanel 组件
            var grid = new Ext.grid.GridPanel({
                frame: true,
                enableHdMenu: true,
                width: 600,
                height: 300,
                title: 'repairHistory表的信息',
                loadMask: { msg: '正在加载数据,请耐心等待……' },
                el: 'grid',
                store: store,
                cm: cm,
                bbar: bbar,
                viewConfig: {
                    forceFit: true
                },
                items: [{
                    xtype: "textfield",
                    id: "show",
                    value: "",
                    hidden: true
}],
                    buttons: [{
                        text: "添加",
                        id: "add"
                    }, {
                        text: "删除",
                        id: "delete",
                        disabled: true
}]
                    });
                    grid.render();
                    store.load({ params: { start: 0, limit: 10} });    // 初始时显示第 1 页,每页显示 10条数据
  ///**                  
                    //点击添加按钮的事件
                    Ext.getCmp("add").on("click", function() {
                    //addForm();
/////////////////////////////////////////////////////////////
                    var formadd = new Ext.FormPanel({
                        //renderTo:"add",
                        width: 300,
                        height: 175,
                        labelAlign: "right",
                        buttonAlign: "center",
                        frame: true,
                        id: "addform",
                        defaultType: "textfield",
                        items: [{
                            fieldLabel: "名称",
                            id: "name",
                            allowBlank: false, //如果是true,则允许,否则不允许,默认是true
                            blankText: "请输入名称!"
                        }, {
                            fieldLabel: "设备号",
                            id: "number",
                            allowBlank: false,
                            blankText: "请输入设备号!"
                        }, {
                            fieldLabel: "维修内容",
                            id: "content",
                            allowBlank: false,
                            blankText: "请输入维修内容!"
                        }, {
                            fieldLabel: "操作人",
                            id: "driver",
                            allowBlank: false,
                            blankText: "请输入操作人!"
}],
                            buttons: [{
                                text: "添加",
                                id: "btnadd",
                                handler: function() {                                    if (formadd.form.isValid()) {
                                        //Ext.Msg.alert("sssssssssssss");
                                        formadd.form.submit({
                                            url: "addHandler.ashx",
                                            waitMsg: "正在执行添加操作",
                                            success: function(form, action) {
                                                if (Ext.encode(action.result.res)) {
                                                    Ext.Msg.alert("提示", "添加成功!");
                                                    //window.location.href = "Default.aspx";
                                                    grid.store.reload();//重新加载grid
                                                }
                                            },
                                            failure: function(form, action) {
                                                if (Ext.encode(action.result.res)) {
                                                    Ext.Msg.alert("提示", "添加失败!");
                                                }
                                            }
                                        });
                                    }                                }
                            }, {
                                text: "重置",
                                id: "reset",
                                handler: function() {
                                    formadd.form.reset();
                                }
}]
                            });
                            newWin = new Ext.Window
    (
        {
            layout: 'form',
            width: 320,
            height: 220,
            collapsible: true, //允许缩放条
            closeAction: 'hide',
            closable: true,
            plain: true,
            modal: 'true',
            title: '添加信息',
            items: formadd
        }
    )
                            //显示窗体
                            newWin.show();
 ///////////////////////////////////////////////////////////////////////////                   
                    
                        });
                   //**/
                    
                    });
                    grid.addListener('celldblclick', celldblclick);
                    function celldblclick(grid, rowIndex, columnIndex, e) {
                        var record = grid.getStore().getAt(rowIndex);   //Get the Record
                        //var fieldName = grid.getColumnModel().getDataIndex(columnIndex); //Get field name
                        var id = record.get("RepairID");
                        var name = record.get("GroupItemName");
                        var number = record.get("GroupItemPhone"); //
                        var content = record.get("RepairContent"); //
                        var driver = record.get("RepairDriver");                    }                    grid.addListener("cellclick", cellclick);
                    function cellclick(grid, rowIndex, columnIndex, e) {                        var record = grid.getStore().getAt(rowIndex);
                        var id = record.get("RepairID");
                        Ext.getCmp("show").setValue(id);
                        Ext.getCmp("delete").setDisabled(false);
                    }
                });
        // 格式化日期
// 将 XML 数据中的原始日期数据(如:2008-04-07T14:39:41.02+08:00)格式化成可读的日期(如:2008-04-07 14:39:41)
function renderDate(value)
{
    var reDate = /\d{4}\-\d{2}\-\d{2}/gi;
    var reTime = /\d{2}:\d{2}:\d{2}/gi;
    return value.match(reDate) + " " + value.match(reTime);
}</script>
</head>
<body>
  <form id="form1" runat="server">
    </form>
<!-- GridPanel 组件的显示位置 -->
<div id="grid" style="height:300px; margin:auto;"></div>  <div id="add" style="height:300px; margin:auto;" align="center"></div>
</body>
</html>