`
suky
  • 浏览: 146977 次
  • 性别: Icon_minigender_2
  • 来自: 厦门
社区版块
存档分类
最新评论

Ext.form.ComboBox编辑页面显示值问题

    博客分类:
  • EXT
EXT 
阅读更多

     最近用EXTJS 3.0开发项目,页面form表单中使用了ComboBox,

 var _typestore = new Ext.data.Store({
                    proxy : new Ext.data.HttpProxy({url:'basecodeType!getJson.action'}),
                    reader: new Ext.data.JsonReader({
                        root: 'records',
                        totalProperty: 'totalCount',
                        id: 'basecodeTypeid',
                        fields: [
                            {name: 'basecodeTypeid'},
                            {name: 'name'}
                        ]
                    }),
                    remoteSort: true                    
                });
                 _typestore.load({params:{start:0,limit:6,sort:'basecodeTypeid',dir:'desc'}});

                var _type=new Ext.form.ComboBox({
                    id:'basecodetype',
                    fieldLabel: '辅助编码类型',
                    name: 'basecode.basecodetype.basecodeTypeid',
                    hiddenName :'basecode.basecodetype.basecodeTypeid',
                    editable:false,//默认true,禁止手写和联想功能
                    typeAhead: true,
                    triggerAction: 'all',
                    lazyRender:true,
                    mode: 'remote',//指定数据加载方式:remote服务器,local客户端
                    emptyText:'--请选择--',
                    width: 210,
                    store: _typestore,
                    valueField:'basecodeTypeid' ,
                    displayField: 'name',
                    pageSize:6
                });
 

 

如何 在进入编辑页面的时候能显示后台传来的值?测试了三种方法均通过,现将其总结如下:

第一种:在_typestore中添加

listeners :{
                        load:function(){
                            Ext.getCmp('basecodetype').setValue(${basecode.basecodetype.basecodeTypeid});
                        }
                    }

 第二种:添加

 _type.on('afterrender',function(){
                   
                    Ext.get('basecodetype').dom.value='<s:property value="basecode.basecodetype.name"/>';
                    Ext.get('basecode.basecodetype.basecodeTypeid').dom.value='<s:property value="basecode.basecodetype.basecodeTypeid"/>';
                });

 注意:'basecodetype'对应ComboBox的id;

          'basecode.basecodetype.basecodeTypeid'对应ComboBox的hiddenName

第三种,所在表单form渲染后,可以不用放在事件里,而是直接添加

 Ext.get('basecodetype').dom.value='<s:property value="basecode.basecodetype.name"/>';
                    Ext.get('basecode.basecodetype.basecodeTypeid').dom.value='<s:property value="basecode.basecodetype.basecodeTypeid"/>';
               

 

 

分享到:
评论

相关推荐

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

    本示例探讨如何利用Ext JS中的`Ext.form.field.ComboBox`组件,结合Java后端和JSON数据格式,来创建这样一个功能。 `Ext.form.field.ComboBox`是Ext JS框架中一个强大的组件,它提供了下拉列表的功能,可以用于创建...

    Ext.form表单中各种属性应用详解

    **Ext.form.ComboBox** 是一个下拉列表框组件,用于提供可选列表供用户选择。 - **allQuery**: 类型为 `String`,当用户在组合框中输入时,此属性定义所有匹配的项都将显示在列表中。 - **autoCreate**: 类型为 `...

    extjs-Ext.ux.form.LovCombo下拉框

    另一方面,“火狐下div不显示背景色的问题”可能涉及到CSS的渲染差异,`Ext.ux.form.LovCombo`对此进行了修正,使得下拉框在火狐浏览器中能正确显示背景色,提供良好的用户体验。 标签中包含的“eztjs多选单选...

    EXT.form组件

    3. `combo`:`Ext.form.ComboBox`是下拉列表框组件,允许用户在预设的选项中进行选择,同时可以提供搜索功能以便快速定位选项。 4. `datefield`:`Ext.form.DateField`是日期选择组件,用户可以通过日历控件选择...

    EXT dojochina文本框示例Ext.form.TextField.rar

    8. **组合框模式**:`Ext.form.TextField`还可以扩展为`Ext.form.ComboBox`,实现下拉选择功能,这在需要用户从预定义选项中选择时非常有用。 在压缩包中的`Ext.form.TextField`文件夹,很可能是包含了一个或者多个...

    Ext组合框comboBox带分页

    用EXT来实现下拉框ComboBox 下拉框可以实现分页

    ext多选下拉列表的全选功能实现

    此外,可能还需要配置`displayField`(显示字段)和`valueField`(值字段)来处理数据模型。 2. **数据源**:MultiComboBox的数据通常来自服务器或者本地数据结构。我们需要确保数据源包含所有的可选项,并且每个...

    Ext4.0 动态修改ComboBox选择项(本地模式)

    var comboBox = Ext.create('Ext.form.ComboBox', { fieldLabel: '选择项', store: ['选项1', '选项2', '选项3'], displayField: 'text', valueField: 'text', }); ``` 2. **添加或删除选项**: 当需要添加...

    Ext.Store的获取方法

    在Ext.js中,`Ext.Store`是用来管理数据的类,它通常与各种UI组件(如Grid、ComboBox等)关联,用于存储和检索数据。然而,获取`Ext.Store`的方式并不像获取其他Ext组件那样直接,因为Store并不是一个具有可视界面的...

    extjs editgrid combobox 回显

    在探讨“extjs editgrid combobox 回显”这一主题时,我们主要关注的是如何在ExtJS框架下,实现编辑网格(EditGrid)中的组合框(ComboBox)的值能够正确地回显到网格中。这一功能对于那些需要用户在表单中选择数据...

    可编辑表格Ext.grid.EditorGridPanel

    Ext.grid.EditorGridPanel是Ext JS库中的一个组件,主要用于创建具有可编辑单元格的表格。这个组件在数据展示和编辑方面提供了丰富的功能,是构建数据密集型应用的理想选择。下面将详细阐述其特点、工作原理及如何...

    EXT2_combobox_form.rar_combobox ext_ext

    EXT2_combobox_form.rar_combobox ext_ext 这个标题暗示我们关注的是一个与EXT2相关的项目,其中包含了关于form表单和combobox的示例。EXT是一个流行的JavaScript库,主要用于构建富客户端应用,特别是Web应用的用户...

    Ext组件描述,各个组件含义

    **2.18 ComboBox (Ext.form.ComboBox)** - **xtype**: `combo` - **功能描述**:ComboBox 是一个下拉列表框,用户可以从列表中选择一个值。 - **主要用途**:适用于需要用户从预定义的选项中选择的场景。 **2.19 ...

    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....

    Ext combobox 下拉多选框带搜索功能

    而“下拉多选框”意味着这个ComboBox支持多选模式,用户可以选择多个值而不是仅限于一个。结合“带搜索功能”的描述,我们可以推断出这是一个定制的ComboBox,它增加了实时搜索功能,用户在输入框中输入文本时,下拉...

    解决ext下拉列表全选和去全选功能

    comboBox.setValue(comboBox.getStore().getValues()); } }); var deselectAllBtn = Ext.create('Ext.button.Button', { text: '全不选', handler: function() { comboBox.getStore().each(function(record) {...

    用Ext 2.0 combobox 做的省份和城市联动选择框的例程

    var provinceComboBox = new Ext.form.ComboBox({ store: provincesStore, displayField: 'provinceName', valueField: 'provinceId', listeners: { select: function(combo, record, index) { var ...

    Extjs4.X下comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用

    Ext.create('Ext.form.field.ComboBox', { fieldLabel: '选择部门', store: Ext.create('Ext.data.TreeStore', { model: 'Department', root: { text: '所有部门', expanded: true, children: [ /* ... *...

    Extjs3.4.0版本 多选下拉框效果支持多选/全选/全不选

    1. **创建一个新的类**:定义一个继承自Ext.form.ComboBox的新类,添加必要的配置和方法来支持多选。 2. **配置store**:设置一个数据存储(Store)来保存可选项,确保每个记录都有一个表示选中状态的字段,如`...

    Ext下拉树、下拉表格

    4. 配置下拉组合框:使用Ext.form.field.ComboBox,配置其store为表格数据模型,指定显示字段和值字段,同时设置 tpl 或者 displayField 和 valueField 来定制显示和选择项。 在myEclipse的Web项目中,你需要将这些...

Global site tag (gtag.js) - Google Analytics