`
Fangrn
  • 浏览: 800905 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ext.form.ComboBox加载json时刻默认选中的解决

阅读更多

重写combo的setValue

Ext.override(Ext.form.ComboBox, {
      setValue : function(node) {
        if (typeof node == "object") {
          // 当node为object对象时
          this.lastSelectionText = node.text;
          this.setRawValue(node.text);
          if (this.hiddenField) {
            this.hiddenField.value = node.id;
          }
          this.value = node.id;
          return this;
        } else {
          // 当node为文本时
          var text = node;
          if (this.valueField) {
            var r = this.findRecord(this.valueField, node);
            if (r) {
              text = r.data[this.displayField];
            } else if (Ext.isDefined(this.valueNotFoundText)) {
              text = this.valueNotFoundText;
            }
          }
          this.lastSelectionText = text;
          if (this.hiddenField) {
            this.hiddenField.value = node;
          }
          Ext.form.ComboBox.superclass.setValue.call(this, text);
          this.value = node;
          return this;
        }
      }
    })

 为什么要这样重写请参考ExtJS3 下拉树TreeComboBox的修改

然后在传递过来的json中改为

{
  'success' : true,
  data : {
    'yhId' : 227,
    'yhXm' : '赵刚',
    'yhXh' : {text: '赵刚',id: '227'},
  }
}

 yhXh传递过来不再是文本或数字,而是一个object,为了与下拉树的统一,这里使用text和id来命名文本和参数值

这样在combo默认调用setValue的时候就会自动将值写入到选择框内,但是这只解决了初值赋予的问题,因为我的combo内的选项是自expand的时候才加载的,那么怎样在expand的时候也默认选中默认的选项呢?

  xtype : 'combo',
  id : 'Ext.Strong.tyh.combo.yhXh',
  fieldLabel : '显示在',
  hiddenName : 'yhXh',
  allowBlank : false,
  mode : 'remote',
  readOnly : true,
  triggerAction : 'all',
  store : new Ext.data.JsonStore({
        url : '<@s.url action="tyh_LieBiao_XianShi!json"/>',
        fields : new Ext.data.Record.create(['yhXm', 'yhId']),
        root : 'list',
        // 设置监听 当加载完成后选中当前记录
        listeners : {
          load : function() {
            var comb = Ext.getCmp('Ext.Strong.tyh.combo.yhXh');
            comb.setValue(comb.hiddenField.value);
          }
        }
      }),
  editable : false,
  valueField : 'yhId',
  displayField : 'yhXm'

 修改store的默认load监听事件,在combo expand的时候重新setValue一下,由于这里set进去的不再是object对象,所有会调用正常的set过程将选项选中

分享到:
评论

相关推荐

    Ext.form.field.ComboBox结合Java、JSON实现AutoComplete

    Ext.form.field.ComboBox结合Java、JSON实现AutoComplete

    EXT核心API详解

    53、Ext.form.DateField类 ………… 45 54、Ext.form.ComboBox类 ……………… 46 55、Ext.form.TimeField类 ………… 47 56、Ext.menu.Menu类 ………………… 50 57、Ext.menu.BaseItem类 …………… 50 58、Ext....

    ExtJSWeb应用程序开发指南(第2版)

    4.1.12 Ext.form.field.ComboBox组合框 4.1.13 Ext.form.field.Time时间选择框 4.1.14 Ext.form.field.Date日期选择框 4.1.15 Ext.form.field.Hidden隐藏字段 4.1.16 Ext.form.field.HtmlEditor编辑器字段 ...

    ExtJS入门教程(超级详细)

    53、Ext.form.DateField类 ………… 45 54、Ext.form.ComboBox类 ……………… 46 55、Ext.form.TimeField类 ………… 47 56、Ext.menu.Menu类 ………………… 50 57、Ext.menu.BaseItem类 …………… 50 58、Ext....

    Ext Js权威指南(.zip.001

    7.3.4 格式化提交数据:ext.data.writer.writer、ext.data.writer.json和ext.data. writer.xml / 322 7.3.5 writer对象的配置项 / 325 7.4 数据模型 / 326 7.4.1 概述 / 326 7.4.2 数据类型及排序类型:ext....

    ext combobox动态加载数据库数据(附前后台)

    前台: 代码如下: var provinceStore = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ url: basePath + “/stationManage/station... //选择省市 var provinceIDadd = new Ext.form.ComboBox({ anchor : ‘98%

    Ext 开发指南 学习资料

    4.1. 不用ext的form啊,不怕错过有趣的东西吗? 4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 4.4.3. ...

    EXT2.0中文教程

    4.1. 不用ext的form啊,不怕错过有趣的东西吗? 4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 4.4.3. ...

    EXT教程EXT用大量的实例演示Ext实例

    4.1. 不用ext的form啊,不怕错过有趣的东西吗? 4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 ...

    轻松搞定Extjs_原创

    二、Ext.form.FormPanel类 93 三、提交表单至服务器 97 四、小结 100 第十六章:更多表单组件 102 一、您能说出哪些表单组件呢? 102 二、表单组件关系图 102 三、组件配置选项介绍 103 四、完整源代码 107 五、小结...

Global site tag (gtag.js) - Google Analytics