Ext.form.ComboBox 传值问题
开发过程中，我们经常使用如下的html，当表单提交时，传入的值是text对应的value
<select id=”comobo”> <option value=”value1″>text1</option> <option value=”value2″>text2</option> <option value=”value3″>text3</option> <option value=”value4″>text4</option> </select>
使用 Ext.form.ComboBox 进行模仿
var comb = new Ext.form.ComboBox({
name:"operation",
store:[['1','insert'],['2','update'],['1','query'],['1','delete']],
displayField:'name',
hiddenName:'process',
value:'1',
mode: 'local',
triggerAction: 'all',
editable:false,
readOnly: true
})
如上代码在页面html中会渲染成如下：
<div id="ext-gen279" class="x-form-field-wrap x-trigger-wrap-focus" style="width: 80px;"> <input id="process" type="hidden" name="process" value="1"/> <input id="operation" name='operation' class="x-form-text x-form-field x-form-focus" type="text" autocomplete="off" size="24" readonly="true" style="width: 55px;"/> <img id="ext-gen280" class="x-form-trigger x-form-arrow-trigger" src="http://www.yibenzhang.com/JSFW/ext/resources/images/default/s.gif"/> </div>
从代码可以看到，一个Ext.form.ComboBox被渲染成html主要分为三部分：
1）隐藏域，这个hiddenName最关键，开发中就是因为少了这个属性，提交给后台总是store的二维值，也就是文本值。
2）一个 input 标签 text 类型 ， 这个不会提交给后台，只是为了模仿HTML的效果而已。
3）图片，这个很好理解，为了更好的兼容所有浏览器，用图片做效果是最好的。
总结：
1）store 用一个数组存储数据源，数组里面每一个对象也是数组，这个数组默认一维是value，二维是text。也就是展现页面的是二维值，传给后台的是一维的值。
2）hiddenName 属性最为重要，从生成的HTML可以看到，实际上是提交 process=1，提交给后台的是以hiddenName指定的值和store的一维值。如果没有hiddenName，那么HTML也不会有
<input id="process" type="hidden" name="process" value="1"/>
那么，提交给表单的永远是name指定的值和二维的值，也就是：operation=insert。
3）name：没什么作用，但是可以从生成的HTML中看到，他还是定义了一个input。另外，我们可以通过父组件的find寻找。
4）value：这个值是store的一维值，组件初始化时默认选中哪一个。