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有个问题就是,如果每次查询之后,都需要清空查询结果才能重新显示出数据。
相关推荐
在这个场景中,我们关注的是在EXTJS的Combobox(下拉框)组件中实现分页和动态加载数据的功能。Combobox通常用于展示有限数量的选项,但在大数据集的情况下,一次性加载所有数据可能导致页面性能下降。因此,引入...
6. **优化性能**:对于大型数据集,可能需要使用分页或懒加载来提高性能,避免一次性加载所有数据。 7. **自定义样式**:为了增强用户体验,可能还需要自定义ComboBox的样式,例如搜索框的外观、下拉列表的样式等。...
2. 异步加载:如果数据量大,可以使用分页加载,避免一次性加载过多数据导致性能问题。 3. 错误处理:添加错误处理机制,如请求失败时的提示和恢复操作。 综上所述,实现ExtJS的Combobox二级联动主要是通过监听事件...
在EXTJS 3.x版本中,Combobox是一个非常实用的组件,它提供了下拉列表功能,用户可以在输入框中输入文字,系统会根据输入内容自动进行模糊匹配,给出相关的建议选项。这种功能在数据筛选、搜索或者选择项较多时特别...
在本教程中,我们将深入探讨ExtJS中的"RemoteCheckboxGroup",这是一个用于处理远程数据源的动态复选框组件。这个组件通常用于显示从服务器获取的动态选项,它允许用户根据需要选择或取消选择多个选项,同时将这些...
- `GridPanel` 是EXTJS中用于展示表格数据的组件,它可以灵活地处理大量数据,并提供排序、分页、过滤等功能。 - 在 `GridComboBox` 中,`GridPanel` 作为下拉菜单的内容,使用户能以表格形式查看和选择数据。 3....
在EXTJS这个强大的JavaScript框架中,ComboBox控件是一种常用的组件,它用于实现下拉选择框的功能。本篇学习笔记将深入探讨EXTJS中ComboBox的联动效果,即一个ComboBox的选择会触发另一个ComboBox的数据更新,以此来...
本篇我们将聚焦于ExtJS中的一个特定控件——带分页的LOV(Look Up Value)Combo,它结合了Combobox和分页功能,方便用户在大量的数据中选择值。 LOV Combo(Look Up Value ComboBox)是ExtJS中的一种复合控件,它的...
在EXTJS4中,下拉菜单树(ComboBox+Tree)是一种高级UI组件,它结合了ComboBox的下拉选择框和TreePanel的树形结构,提供了一种用户友好的交互方式,用于展示层次化的数据。这种组件特别适用于需要从多个选项中进行...
- 分页功能是处理大量数据时的常见需求,在Extjs中可以通过特定的组件如GridPanel实现分页。 #### 13. 表单组件 Extjs中的表单组件丰富,包括: - FormPanel类用于封装表单。 - 各种表单输入元素的配置和使用。 ...
Combobox的核心功能包括自动完成、过滤、分页等,使得数据输入更为便捷高效。 **2. IconCombobox的实现** 在Ext3.4版本中,IconCombobox是对Combobox的增强,它允许每个列表项前面添加一个图标。这在许多场景下都...
在ExtJS6中,下拉列表(ComboBox)是一种常见的组件,用于提供用户可以选择的预定义选项。这个框架提供了丰富的功能和定制性,使得下拉列表不仅能够简单地显示一组静态选项,还能与数据源进行联动,展示动态加载的...
在EXTJS中,将动态Combobox嵌入到Grid中是一种常见的需求,这允许用户在单元格内选择一个下拉列表的值,同时保持数据的关联性。以下是对标题和描述中涉及的知识点的详细说明: 1. **Ext.data.JsonStore**: 这是...
在EXTJS框架中,"多选下拉框"(Multi-Select ComboBox)是一种常见的组件,它允许用户在下拉列表中选择多个选项。EXTJS 3.*版本也提供了这种功能,使得开发者能够创建功能丰富的界面,提升用户体验。下面将详细解释...
ExtJs是一种基于JavaScript的富客户端应用框架,专用于构建交互式、桌面级...在实际开发中,还可以考虑优化性能,如缓存先前的查询结果、添加分页功能以及处理网络延迟等问题,以进一步提升应用的响应速度和用户体验。
- **创建ComboBox**: 结合分页功能创建了一个带有分页的ComboBox实例。 #### 面板(Panel) 面板是Extjs中非常重要的容器组件,可以用来组织和布局其他组件。 - **漂亮的窗格从这里开始**: 强调了面板在布局设计...
18、ExtJS之ComboBox获取远程数据、网页计算器5 W& ]. W7 ?, V/ Q 19、ExtJS之组件面向对象编程(一) 20、ExtJS之组件面向对象编程(一) 21、项目实战-需求分析、数据字典、数据库设计) r, `+ J( `$ l# d7 I$ h# W...
ExtJS4学习笔记(五)---Grid分页 ExtJS4学习笔记(八)---Grid多选 全选 ExtJS4学习笔记(六)---多表头Grid ExtJS4学习笔记(十)---ExtJS4图片验证码的实现 ExtJS4学习笔记(十一)---TabPanel ExtJS4学习笔记(十三)---上传...