解决Extjs中Combobox显示值和真实值赋值问题

用过Extjs的朋友相信都知道在Extjs的Combobox组件中是由两个值来组成的。一个是displayField这个是用来显示给咱们看 的,而另外一个是真正给系统用的valueField,举个例子会更贴切一点。假如咱们有一个下拉列表是公司选择,那咱们看到的option中的值应该是公 司的名称,而实际提交给系统的值多是公司的ID或者编码之类的。而Extjs中的combobox也是一样的道理,可是它只提供了一个 setValue()函数,咱们在调用的时候发生的结果就是要么显示的值和真实的值同是id,或者同是名称。虽然同是id的时候系统能够正常运行,但这样 用户交互就显示的友好了。相信你们都不明白你的1,2,3,表明首什么。node

  在网上查了一下,有的朋友说能够用setvalue()/setRawValue( Mixed value ) 来分别完成,事实上我试了一次并无成功。查了下API中的解释。dom

setRawValue( Mixed value ) : Mixed
跃过验证直接设置DOM元素值。须要验证的设值方法能够查看setValu...
跃过验证直接设置DOM元素值。须要验证的设值方法能够查看setValue。Sets the underlying DOM field's value directly, bypassing validation. To set the value with validation see setValue.

  若是我没有理解错的话这里应该是用于跳过验证赋值的,也就是说你原本有些由于验证不能经过的值能够经过这个函数来设置。(这里搞不懂为何Ext官方会给这样一个函数,既然都是不能验证的那干吗还要赋值)。函数

  在使用firebug分析生成的页面的时候,发现真实的值是用一个隐藏的input来放置的。<input type=”hidden” id=”assistInfo.pid.id” name=”assistInfo.pid.id” value=”9″>既然这样那我就用Ext.get()方法来试试,最终发现确实可使用Ext.get()和form.getForm().findField()来分别赋值,考虑Ext.get()会形成新的内存损耗,故使用Ext.fly()代替,最终代码以下:post

    win.form.getForm().findField('assistInfo.pid.id')
        .setValue(config.curr.node.text);
    Ext.fly('assistInfo.pid.id').dom.value=config.curr.node.id;

2010-10-08 最新修改,以上这个方法仍是有个问题。当你的 cbx得到焦点而又没有修改的时候,在离开时会将你的displayField的值填充给valueField这样的话一样会形成系统错误。而较好的解决 办法为:使用Ext.data.Record.create({})去构建一个combobo的数据对象,并将这个值填充到combobo的 dataStore中,最后再调用setvalue这样就能够完美地解决combobox初始值的问题了。编码


Ext.getCmp('userid').setRawValue(otherName);
Ext.getCmp('userid').setValue(otherId);
这样能够设置默认的name 和id了