extjs4 数据库读取数据动态生成表单

var n=0;     

 var oForm = Ext.create('Ext.form.Panel', {  

        layout:"form",

        id:'myform',

        hideLabels:false,

        border:false,

      

        labelAlign:"right",

        labelWidth:70,

        width:700,

        items:[

            {xtype:'button',text:'添加修改记录',  

            style: ' float:right; margin-bottom:10px',   

            labelAlign:"right", 

            

            listeners:{

                click:function(){

                    

                    

           InserForm(0,'');

                    

                }

            }

            

            

            }

        ]

    });

读取数据库信息

  $.get(url, function(a){
 
for(i=0;i<a.data.length;i++)
{
InserForm(i+1,a.data[i].name);
}

    }）;

function InserForm(num,name)

{

if(num==0)

{

n++;

}

else

{

n=num;

}

var form = new Ext.form.FormPanel({  

    layout:'hbox',

    border:false,

             items: [

             

               {  

                                                    xtype: 'textfield',  

                                                     fieldLabel: '修改记录' +  n,  

                                                    name: 'modifyname'+ n,    

                                                     id: 'modifyname'+ n,   

                                                    allowBlank: false,  

                                                   labelAlign:"right",

                                                    blankText: 'aa名称不能为空',  

                                                    regex: /^[a-zA-Z0-9_\u4e00-\u9fa5]+$/,  

                                                    regexText: '格式应由汉字、数字、字母或下划线组成.',  

                                                    maxLength: 20,  

                                                    maxLengthText: "aa名称长度不能多于20个字！",

                                                    width:400

                                                },

                                                

               {  

                                                 

                                                       style: 'background: #368ECE;border-color:#126DAF;margin-left: 10px',   

                                                    name: 'modifytime',

                                                    xtype:'datefield',editable:false,format:'Y-m-d',allowBlank: false

                                                  

                                                  

                                                },

                                                {  

                                                    xtype: 'button',  

                                                    text: '删除',  

                                                    style: 'background: #368ECE;border-color:#126DAF;margin-left: 10px',  

                                                    handler: function () {  

                                                   

                                                       var _panel = this.ownerCt;

                                                     _panel.hide();

 

                                                      

                                                    }  

                                                }  

             ]       

                    })

getcmp('modifyname'+n).setValue(name);                 

getcmp('myform').items.add(oForm.items.getCount(), form);

getcmp('myform').doLayout();

}