`
gonglil
  • 浏览: 32085 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

ExtJs ComboBox分页问题

 
阅读更多

ExtJs中常常会用到ComboBox下拉列表来显示数据,但是如果数据过于多了,那么通常采用分页的技术。最近在做一个项目时候,遇到了下拉表中的数据读取出来了,但是却没有没有分页,我的主要代码如下:

1.得到store,即需要在ComboBox下拉列表中显示的数据。

 

var spCode = new Ext.data.Store({
   			url:'business!getAllBusiOfParent.action',
   			autoLoad:true,
   			params:{start:0},
            remoteSort: true,
            reader:new Ext.data.JsonReader({
                	    root: "data",
                	    totalProperty:'total'
                	},[        {name:"bizcode"},
                	           {name:"bizname"}
                	  ] )
                	  
   		});

 2.将store放到ComboBox中并进行分页

 

 var spCombo = new Ext.form.ComboBox({   
	        hiddenName : 'bizcode',   
	        fieldLabel : '业务名称',   
	        emptyText:'请选择业务名称',   
	        mode : 'local',   
	        triggerAction : 'all',   
	        valueField : 'bizcode',   
	        displayField : 'bizname',   
	        editable : true,
	        forceSelection:true,
	        allowBlank:true,
	        pageSize:4,
	        store : spCode,
	        width:210,
	        maxHeight:100,
	        listeners : {  
                'beforequery':function(e){                      
                    var combo = e.combo;    
                    if(!e.forceAll){    
                        var input = e.query;     
                        combo.store.baseParams={query:input,limit:combo.pageSize};
                        combo.store.load();
                        return false;  
                    }  
                }
            }

 这里分页的图标也出来了,但是显示的是所有的数据,分页并没有成功。后面仔细的检查代码,发现了triggerAction这个属性设置为了all,需要将其改为query即可。为all的话,则显示出所有的数据,如果为query有个问题就是,如果每次查询之后,都需要清空查询结果才能重新显示出数据。

 

 

分享到:
评论

相关推荐

    extjs4.2 分页combo动态条数 源码

    在这个场景中,我们关注的是在EXTJS的Combobox(下拉框)组件中实现分页和动态加载数据的功能。Combobox通常用于展示有限数量的选项,但在大数据集的情况下,一次性加载所有数据可能导致页面性能下降。因此,引入...

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

    6. **优化性能**:对于大型数据集,可能需要使用分页或懒加载来提高性能,避免一次性加载所有数据。 7. **自定义样式**:为了增强用户体验,可能还需要自定义ComboBox的样式,例如搜索框的外观、下拉列表的样式等。...

    ExtJS Combobox二级联动列子

    2. 异步加载:如果数据量大,可以使用分页加载,避免一次性加载过多数据导致性能问题。 3. 错误处理:添加错误处理机制,如请求失败时的提示和恢复操作。 综上所述,实现ExtJS的Combobox二级联动主要是通过监听事件...

    extjs3.x combobox智能联想

    在EXTJS 3.x版本中,Combobox是一个非常实用的组件,它提供了下拉列表功能,用户可以在输入框中输入文字,系统会根据输入内容自动进行模糊匹配,给出相关的建议选项。这种功能在数据筛选、搜索或者选择项较多时特别...

    无废话ExtJs 系统教程十九[动态复选框:RemoteCheckboxGroup]

    在本教程中,我们将深入探讨ExtJS中的"RemoteCheckboxGroup",这是一个用于处理远程数据源的动态复选框组件。这个组件通常用于显示从服务器获取的动态选项,它允许用户根据需要选择或取消选择多个选项,同时将这些...

    Extjs4下拉菜单ComboBox中用Grid显示通用控件

    - `GridPanel` 是EXTJS中用于展示表格数据的组件,它可以灵活地处理大量数据,并提供排序、分页、过滤等功能。 - 在 `GridComboBox` 中,`GridPanel` 作为下拉菜单的内容,使用户能以表格形式查看和选择数据。 3....

    Extjs学习笔记(-):ComboBox联动

    在EXTJS这个强大的JavaScript框架中,ComboBox控件是一种常用的组件,它用于实现下拉选择框的功能。本篇学习笔记将深入探讨EXTJS中ComboBox的联动效果,即一个ComboBox的选择会触发另一个ComboBox的数据更新,以此来...

    Extjs之--带分页的lovcombo控件

    本篇我们将聚焦于ExtJS中的一个特定控件——带分页的LOV(Look Up Value)Combo,它结合了Combobox和分页功能,方便用户在大量的数据中选择值。 LOV Combo(Look Up Value ComboBox)是ExtJS中的一种复合控件,它的...

    extjs4 下拉菜单树 combobox+tree 支持单选多选

    在EXTJS4中,下拉菜单树(ComboBox+Tree)是一种高级UI组件,它结合了ComboBox的下拉选择框和TreePanel的树形结构,提供了一种用户友好的交互方式,用于展示层次化的数据。这种组件特别适用于需要从多个选项中进行...

    轻松搞定Extjs 带目录

    - 分页功能是处理大量数据时的常见需求,在Extjs中可以通过特定的组件如GridPanel实现分页。 #### 13. 表单组件 Extjs中的表单组件丰富,包括: - FormPanel类用于封装表单。 - 各种表单输入元素的配置和使用。 ...

    Ext带图标Combobox

    Combobox的核心功能包括自动完成、过滤、分页等,使得数据输入更为便捷高效。 **2. IconCombobox的实现** 在Ext3.4版本中,IconCombobox是对Combobox的增强,它允许每个列表项前面添加一个图标。这在许多场景下都...

    Extjs6 下拉列表

    在ExtJS6中,下拉列表(ComboBox)是一种常见的组件,用于提供用户可以选择的预定义选项。这个框架提供了丰富的功能和定制性,使得下拉列表不仅能够简单地显示一组静态选项,还能与数据源进行联动,展示动态加载的...

    extjs中grid中嵌入动态combobox的应用

    在EXTJS中,将动态Combobox嵌入到Grid中是一种常见的需求,这允许用户在单元格内选择一个下拉列表的值,同时保持数据的关联性。以下是对标题和描述中涉及的知识点的详细说明: 1. **Ext.data.JsonStore**: 这是...

    extjs多选下拉框

    在EXTJS框架中,"多选下拉框"(Multi-Select ComboBox)是一种常见的组件,它允许用户在下拉列表中选择多个选项。EXTJS 3.*版本也提供了这种功能,使得开发者能够创建功能丰富的界面,提升用户体验。下面将详细解释...

    ExtJs Google Suggest 动态查询效果

    ExtJs是一种基于JavaScript的富客户端应用框架,专用于构建交互式、桌面级...在实际开发中,还可以考虑优化性能,如缓存先前的查询结果、添加分页功能以及处理网络延迟等问题,以进一步提升应用的响应速度和用户体验。

    轻松搞定Extjs

    - **创建ComboBox**: 结合分页功能创建了一个带有分页的ComboBox实例。 #### 面板(Panel) 面板是Extjs中非常重要的容器组件,可以用来组织和布局其他组件。 - **漂亮的窗格从这里开始**: 强调了面板在布局设计...

    深入浅出Extjs4.1.1

    18、ExtJS之ComboBox获取远程数据、网页计算器5 W& ]. W7 ?, V/ Q 19、ExtJS之组件面向对象编程(一) 20、ExtJS之组件面向对象编程(一) 21、项目实战-需求分析、数据字典、数据库设计) r, `+ J( `$ l# d7 I$ h# W...

    ExtJS4中文教程2 开发笔记 chm

    ExtJS4学习笔记(五)---Grid分页 ExtJS4学习笔记(八)---Grid多选 全选 ExtJS4学习笔记(六)---多表头Grid ExtJS4学习笔记(十)---ExtJS4图片验证码的实现 ExtJS4学习笔记(十一)---TabPanel ExtJS4学习笔记(十三)---上传...

Global site tag (gtag.js) - Google Analytics