form表單 獲取與賦值

form表單中使用頻繁的組件: 文本框、單選框、多選框、下拉框、文本域
form通過getValues()獲取表單中所有name的值

通過setValues({key:values})給對應的name值進行賦值，其中key對應的name值

?

在給單選框和多選框賦值時，有幾個疑惑的地方：
　　1. fieldName和name 是否必須一致 ？

???????? (fieldName刪除對結果沒什么影響，表單是通過name值去獲取值得)

??　 2. name與子項的name 也一致是為何？
????? (個人理解：

　　　　　　通過getValues獲取值時是key:value，單選框和多選框子項有多個，獲取的value值時子項值的集合，而不能找到具體到對象

　　　　　　此時要再進行一次key:value賦值，所以在代碼中賦值時就出現了，value.key = {key: value.key}，
???????????????? 舉個例子：
??????????????????? var set_values = { radioName:0 };
??????????????????? 此時set_values是單選框獲取的值，是一個結果，要將其賦值必須先找到單選框對象，然后在定位到單選框子對象
??????????????????? 所以setValues(set_values) 其實單選框對象，而沒有具體到子對象，因此要再進行一次setValues
??????????????????? 轉換的格式就是:
??????????????????????? var set_new_values = {}
??????????????????????? var set_new_values.radioName = {
??????????????????????????? radioName: set_values.radioName
??????????????????????? }

??????????????????? form.setValues(set_new_values); ?
??????????????????? 此時就可以定位到單選框子對象

???? 多選框和單選框的邏輯是一直，區別只是單選框值只有一個，而多選框值時一個數組
　　)

重復知識點：?

??? JSON.parse(jsonstr);????? //可以將json字符串轉換成json對象?

??? JSON.stringify(jsonobj); //可以將json對象轉換成json對符串

?

　　　　　　　　Ext.onReady(function(){//Ext.Msg.alert("提示","hello world...")var ageStore = new Ext.data.Store({fields: ['text', 'id'],data: [{"id":18,"text":"18"},{"id":19,"text":"19"},{"id":20,"text":"20"},{"id":21,"text":"21"}],autoLoad: true});//1.創建一個form表單var formpanel = Ext.create("Ext.form.Panel",{title:"form表單獲取與賦值",width:650,height:250,border:true,renderTo:Ext.getBody(),items:[{xtype:"textfield",fieldLabel: "姓名",width:200,labelWidth:80,name:"UserName"}, {xtype:"textfield",fieldLabel: "手機號",width:200,labelWidth:80,name:"Tel"},{xtype: "combo",fieldLabel: "年齡", fieldName: "UserAge",name: "UserAge",labelWidth: 80,allowBlank: false,blankText: "年齡不能為空",autoFitErrors: true,mode: 'local',msgTarget: "side",store: ageStore, displayField: "text",valueField: "id"}, {xtype: "checkboxgroup",fieldLabel: "上課時間",labelWidth: 80,width: 600,name: "Weeks",fieldName: "Weeks",items: [{boxLabel: "星期一",name: "Weeks",inputValue: 1,checked: true}, {boxLabel: "星期二",name: "Weeks",inputValue: 2, }, {boxLabel: "星期三",name: "Weeks",inputValue: 3, }, {boxLabel: "星期四",name: "Weeks",inputValue: 4, }, {boxLabel: "星期五",name: "Weeks",inputValue: 5, }, {boxLabel: "星期六",name: "Weeks",inputValue: 6, }, {boxLabel: "星期日",name: "Weeks",inputValue: 0, }]}, {xtype: "radiogroup",width: 300,labelWidth: 80,fieldLabel: "上課/兼職",fieldName: "RadioTimeSpanType",name: "RadioTimeSpanType",items: [{ boxLabel: "去上課", name: "RadioTimeSpanType", inputValue: 0, checked: true },{ boxLabel: "去兼職", name: "RadioTimeSpanType", inputValue: 1}], listeners: {change: function(obj, newValue, oldValue, eOpts){// 單選事件   
                                }}}],buttons:[{text:"保存",handler:function(){var values = formpanel.getForm().getValues();// JSON.parse(jsonstr); //可以將json字符串轉換成json對象// JSON.stringify(jsonobj); //可以將json對象轉換成json對符串 document.getElementById("save_values").value = JSON.stringify(values);}}, {text:"清空",handler:function(){formpanel.getForm().reset();}}, {text:"自動填充",handler:function(){//獲取填充的值var values = document.getElementById("save_values").value ;if(values){//注意，獲取的值必須是json格式才可以var json_values = JSON.parse(values); //可以將json字符串轉換成json對象 //文本框和下拉框賦值就是key:value就可以//單選框和復選框有點不一樣// 將key:value值轉成key:{key:value}類型json_values.Weeks = {Weeks: json_values.Weeks}json_values.RadioTimeSpanType = {RadioTimeSpanType: json_values.RadioTimeSpanType}//賦值
                                    formpanel.getForm().setValues(json_values);}}} ]});});


      //下面是body中顯示值的div
        <div>
??????????? form的值：<br/>
??????????? <textarea id="save_values" style="width:700px; height: 100px;"> </textarea>
??????? </div>

?