Ext Combox的相关问题

Combox
   Ext.form.Combox
  
   问题1、实现Combox下拉列表的悬浮提示
   方法:
   1).开启Ext的提示功能,Ext.QuickTips.init();
   2).var tpl = new Ext.XTemplate('<tpl for="."><div class="x-combo-list-item" ext:qtitle=""
                                  ext:qtip="{attrName}">{attrName:ellipsis(20)}</div></tpl>');
      在Combox的tpl属性中加入  即tpl : tpl    这样就有效果了
      特别注意:{attrName} 中的attrName是要悬浮提示的内容  ellipsis(20) 设置文本的现实长度
  
   问题2、如何在Combox的下拉框中加入滚动条,以显示出长文本
   方法:
   1).加入展开时的事件驱动
      tagFeature.on("expand",function(){
          this.innerList.dom.style.overflowX="auto"; //改变横向overflow的样式,显示横向的滚动条
     });
     tagFeature 表示Combox  前文:var tagFeature = new Ext.form.Combox();
    
    
  Example :-- begin
     var tagFeature = new Ext.form.ComboBox({
     id : "tagFeatureId",   // Combox的id
     hiddenName : "tagFeature", 
     fieldLabel : "标签特征", 
     emptyText : ' ',
     valueField : 'attrCode',  // 值字段  与fields : ['attrCode', 'attrName'],对应
     displayField : 'attrName',  //展示字段   与fields : ['attrCode', 'attrName']对应
     typeAhead : true,   //值为true时在经过指定延迟(typeAheadDelay)后弹出并自动选择输入的文本 默认为false
     mode : 'local',
     width : 135,
     //listWidth : 500,
     //tpl : tpl,   
     triggerAction : 'all',
     selectOnFocus : true,
     editable : false,   // 是否可编辑
     store : new Ext.data.JsonStore({
      url : 'userTagSearch.do?action=queryTagFeature',
      fields : ['attrCode', 'attrName'],
      autoLoad : true,
      root : 'records',
      listeners : {
       load : function(store, records, options) {
        Ext.getCmp('tagFeatureId').setValue('');
       }
      }
     })
    });
    
    tagFeature.on("expand",function(){
           this.innerList.dom.style.overflowX="auto"; //改变横向overflow的样式,显示横向的滚动条
    });
    -- end
    
    问题3、设置Combox的默认值
    方法:
    一般是在数据加载时设置默认值,当然也可以在加载后设置
    加载时设置:
        在 store的配置项中
        store : new Ext.data.JsonStore({
            url : 'userTagSearch.do?action=queryTagFeature',
            fields : ['attrCode', 'attrName'],
            autoLoad : true,
            root : 'records',
            listeners : {
               <!---------  在这里 begin -------->
             load : function(store, records, options) {
              Ext.getCmp('tagFeatureId').setValue('');   // 这里的setValue(id) id为valueField对应的值
             }
             <!---------  在这里 end -------->
            }
          }),
          
      加载后在外部设置:
        Ext.getCmp('labelPageId').store.reload();  -- 让Combox的store重新load,即reload()
       Ext.getCmp('labelPageId').store.on('load',function(){   -- 绑定load事件,触发function()
         Ext.getCmp('labelPageId').setValue(comboDefaultValue);
       });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值