`
y1d2y3xyz
  • 浏览: 257599 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Ext.form.ComboBox 远程带分页显示

阅读更多
很多时候针对大数据量的下拉列表的时候,我们通常需要分页显示数据,就像grid一样
效果:



//这里是Store
var store = new Ext.data.JsonStore({
	root: 'rows',//
        totalProperty: 'total',//显示总页数的字段
	idProperty: 'ID',//记录ID的字段
	remoteSort: true,//是否为远程
	baseParams :{start:0,limit:15},
	proxy: new Ext.data.ScriptTagProxy({
		url: '/ah/policies/12/insures'
	}),
	fields: [
		{name:'ID',mapping:'ID'},
		{name:'Name',mapping:'Name'},
                {name:'IdNo',mapping:'IdNo'}
		]
			
});

//下面是应用,pageSize 最重要的就是这个参数,即每次查询多少条记录,每天这个参数就不会显示页面工具栏了,其他参数没什么解释的
//tpl 我们可以加上tpl显示信息
{
        xtype:'combo',
        tpl:'<tpl for="."><div ext:qtip="提示:名字({Name}),证件号码({IdNo})" class="x-combo-list-item">{Name}-{IdNo}</div></tpl>',
        fieldLabel: '被保险人',
	store:_this.store,
	emptyText : '请选择投保人',
	allowBlank:false,
	hiddenName:'PlanID',
	loadingText: 'searching...',
	displayField : 'Name',
	mode:'remote',
	editable : false,
	valueField: 'ID',
	anchor : '68%',
	hiddenName:'RecordID',
	pageSize:15,
	triggerAction: 'all'
}
  • 大小: 12.9 KB
分享到:
评论

相关推荐

    Ext组合框comboBox带分页

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

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

    "ext多选下拉列表的全选功能实现"这个主题聚焦于一个特定的UI组件——ExtJS库中的MultiComboBox,这是一种允许用户多选的下拉列表控件。在实际应用中,全选功能常常被用来快速选择所有选项,极大地提高了用户的操作...

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

    在给定的标题“Ext ComboBox 下拉多选框带搜索功能”中,我们关注的是一个特别的ComboBox实现,它不仅允许用户从下拉列表中选择多个选项,还具备搜索功能,使得用户可以更高效地找到他们想要的选择项。 ComboBox在...

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

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

    可编辑表格Ext.grid.EditorGridPanel

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

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

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

    Ext Js权威指南(.zip.001

    Ex4.0共2个压缩包特性,《ext js权威指南》 前 言 第1章 ext js 4开发入门 / 1 1.1 学习ext js必需的基础知识 / 1 1.2 json概述 / 3 1.2.1 认识json / 3 1.2.2 json的结构 / 3 1.2.3 json的例子 / 4 1.2.4 ...

    ExtJs_xtype一览

    - `combo`:`Ext.form.ComboBox`,下拉选择框。 - `datefield`:`Ext.form.DateField`,日期选择输入框。 - `timefield`:`Ext.form.TimeField`,时间输入框。 - `field`:`Ext.form.Field`,表单的基础字段。 ...

    ExtJS-3.4.0系列目录

    - `Ext.form.field.ComboBox`:下拉列表框,可以是静态或动态加载的。 - `Ext.form.field.Time`:时间选择器。 - `Ext.form.field.Date`:日期选择器。 - `Ext.form.field.Hidden`:隐藏字段。 - `Ext.form....

    ext设置分页大小.rar

    在EXT中,我们可以使用`Ext.grid.Panel`或`Ext.dataview.List`等组件来创建带有分页的表格或列表。要设置分页大小,我们首先需要引入EXT的分页插件`Ext.toolbar.Paging`,然后在配置对象中指定`pagingConfig`。以下...

    Ext.data专题

    **Grid** 和 **ComboBox** 等组件都是基于Ext.data进行数据操作的。它们利用这些核心组件来实现诸如异步加载、类型转换、分页等功能。 #### 二、数据格式和支持 Ext.data支持多种数据格式,包括但不限于: - **...

    ExtJs组件类的对应表

    3. **`combo`** - `Ext.form.ComboBox`,下拉框组件,用于创建下拉选择框。 4. **`datefield`** - `Ext.form.DateField`,日期选择项,用于输入日期。 5. **`timefield`** - `Ext.form.TimeField`,时间录入项,...

    Ext combo 下拉框级联

    var parentComboBox = Ext.create('Ext.form.field.ComboBox', { store: parentStore, displayField: 'name', valueField: 'id', listeners: { select: function (combobox, records) { var parentId = ...

    Ext JS 实现建议词模糊动态搜索功能

    总结一下,实现建议词模糊动态搜索的关键在于使用`Ext.form.ComboBox`并配置其属性以连接到服务器端接口,监听用户的输入,并根据输入进行远程查询。同时,`JsonStore`用于存储和管理从服务器获取的数据。通过调整...

    Ext带图标Combobox

    var combo = new Ext.form.ComboBox({ store: store, displayField: 'text', valueField: 'id', tpl: template, typeAhead: true, mode: 'local', triggerAction: 'all', width: 300 }); ``` 以上代码创建...

    ext-2.2.zip

    在CDH使用oozie 的时候需要安装ext-2.2.zip; 新增和改进的功能包括: 1、FileUploadField 文件上传 体验例子见:...Ext.form.ComboBox 的样式就很漂亮!

    ExtJs xtype一览

    - **`combo` (Ext.form.ComboBox)**: 下拉框组件,提供了一个下拉列表供用户选择。 - **`datefield` (Ext.form.DateField)**: 日期选择项组件,用于输入日期值。 - **`timefield` (Ext.form.TimeField)**: 时间录入...

    extJs xtype 类型

    3. **`combo`:** 下拉框组件,用于创建下拉列表,通过`Ext.form.ComboBox`类实现。 4. **`datefield`:** 日期选择项组件,用于让用户选择日期,通过`Ext.form.DateField`类实现。 5. **`timefield`:** 时间录入项...

    Extjs实用教程

    - **ComboBox**: `Ext.form.ComboBox`,下拉选择框。 - **DateField**: `Ext.form.DateField`,日期输入框。 - **Field**: `Ext.form.Field`,表单字段基类。 - **FieldSet**: `Ext.form.FieldSet`,表单字段组...

    ExtJS Combobox二级联动列子

    var provinceComboBox = new Ext.form.ComboBox({ store: provinceStore, displayField: 'name', valueField: 'id', typeAhead: true, queryMode: 'local', listeners: { select: function(combo, record, ...

Global site tag (gtag.js) - Google Analytics