ExtJs 下拉菜单分页工具插件 代码分析
Ext.ns("Ext.ux");
//创建插件对象
Ext.ux.PageSizePlugin = function(){
//调用父对象的构造方法,并为此插件生成一个预定义store的下拉菜单
Ext.ux.PageSizePlugin.superclass.constructor.call(this,{
store : new Ext.data.SimpleStore({
fields : ['text','value'],
data : [['10',10],['20',20],['30',30],['40',40],['50',50]]
}),
mode : 'local' ,
displayField : 'text' ,
valueField : 'value' ,
editable : false ,
allowBlank : false ,
triggerAction : 'all' ,
width : 60
})
}
//插件继承ComboBox
Ext.extend(Ext.ux.PageSizePlugin ,Ext.form.ComboBox ,{
//插件必须调用的方法(或者说插件唯一自动调用的方法)
init : function(paging){//paging是PageSizePlugin插件所在组件的对象(PaggingToolbar)
paging.on('render',this.onInitView,this);//为PaggingToolbar定义渲染之后调用的方法,以及指定该方法的作用域为ComboBox
},
onInitView : function(paging){
paging.add('-',
this ,
'条/页'
);
this.setValue(paging.pageSize);//设置ComboBox的值
this.on('select',this.onPageSizeChanged,paging);//为ComboBox定义选择下拉菜单后调用的方法,以及指定该方法的作用域为PaggingToolbar
},
onPageSizeChanged : function(combo){
this.pageSize = parseInt(combo.getValue());
//compage = parseInt(combo.getValue()); this.doLoad(0);//PaggingToolbar调用私有方法加载数据,参数0为start
}
}) //一点思考:调用父对象的构造方法 完全可以写在init方法的第一行,这样写不容易打断自己的思路,然而这样写会显得比较乱,代码不清晰。
//从代码执行顺序上考虑:插件所在的组件找到这个插件后,会先创建插件对象并继承父对象,然后再调用插件的init方法
ExtJs 下拉菜单分页工具插件 代码分析的更多相关文章
- Easyui表单,文本框,下拉菜单三级联动练习代码
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- (JavaScript插件——下拉菜单)
前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html 本文主要来学习一下JavaScrip ...
- 初学者--bootstrap(六)组件中的下拉菜单----在路上(10)
组件---下拉菜单 用于显示链接列表的可切换.有上下文的菜单.下拉菜单的 JavaScript 插件让它具有了交互性. 将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里,或者另一个声明了 p ...
- Bootstrap3系列:按钮式下拉菜单
1. 基本实例 把按钮放入 .btn-group 中,加入适当的菜单标签,让按钮触发下拉菜单. 1.1 示例代码 <div class="btn-group"> < ...
- [jquery]添加行内容后根据下拉菜单选择内容对比之前已有选项,若有重置再提示
今天页面上一个添加列内容时,要对选择内容与之前已有选项内容作对比,防止用户重复选择内容 页面HTML代码 <ul class="list-group xj-list-NObor xj- ...
- 纯css实现横向下拉菜单
自己最近在捣腾css代码,不光是js能做很多有趣的东西,这货也可以做很多东西,现在把自己的一些作品分享给大家. 做得有点粗糙,大家根据这个思路来,可以自己修改修改. 关于demo:这是一个横向下拉的菜 ...
- 下拉菜单;手风琴;九宫格的Jquery的使用实例
下拉菜单;手风琴;九宫格的Jquery的使用实例 1.下拉菜单 效果如图: 代码如下: <!DOCTYPE html> <html lang="en"> & ...
- zTree插件之多选下拉菜单代码
zTree插件之多选下拉菜单代码 css和js <!--ztree树结构--> <link rel="stylesheet" type="text/cs ...
- Bootstrap 下拉菜单和滚动监听插件
一.下拉菜单 常规使用中,和组件方法一样,代码如下: //声明式用法 <div class="dropdown"> <button class="btn ...
随机推荐
- SharePoint中修改密码的WEB Part之终极版:即可以修改AD,又可以修改本机用户密码的Web Part!!
转:http://www.cnblogs.com/dosboy/archive/2007/08/01/838859.html 在网上查了那么多SharePoint密码修改的第三方开发,都有问题.总结下 ...
- HDU 4968 Improving the GPA
Improving the GPA Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Othe ...
- 《Oracle Database 12c DBA指南》第一章 - 基本技能简介
当前关于12c的中文资料比较少,本人将关于DBA的一部分官方文档翻译为中文,很多地方为了帮助中国网友看懂文章,没有按照原文句式翻译,翻译不足之处难免,望多多指正. 1 基本技能简介 作为一个数据库管理 ...
- FZU 2129 子序列个数
Problem Description 子序列的定义:对于一个序列a=a[1],a[2],......a[n].则非空序列a'=a[p1],a[p2]......a[pm]为a的一个子序列,其中1& ...
- linux C编程之makefile
目的: 基本掌握了 make 的用法,能在Linux系统上编程.环境: Linux系统,或者有一台Linux服务器,通过终端连接.一句话:有Linux编译环境.准备: ...
- ALM11测试计划页面图解1
在 ALM 侧栏上的测试下方,选择测试计划. 在查看菜单中,选择测试网格或测试计划树. 在 ALM 侧栏上的测试下方,选择测试计划. 右键单击测试,并选择测试详细信息. 在测试计划树中选择主题文件夹, ...
- iOS几个效果动画-------------------(实例详讲)qq粘性效果
这几天做了一些简单iOS的效果图,感觉苹果官方已经帮我们做了很多了,我们只是站在巨人的肩膀上编程,这些也没什么难的,最难的也就是用到了初中的三角函数,先让大家看看这几个动画吧.先列这几个把,由上而下分 ...
- docker——Dockerfile创建镜像
写在前面: 继续docker的学习,昨天用docker成功跑了tomcat,但是在centos中镜像跑的容器手动装jdk和tomcat,今天学习用Dockerfile创建镜像,并在上面搭建java环境 ...
- 分布式模式之broker模式
转自:http://blog.chinaunix.net/uid-23093301-id-90459.html 问题来源: 创建一个游戏系统,其将运行在互联网的环境中.客户端通过WWW服务或特定的客户 ...
- 【C++深入浅出】设计模式学习之简单工厂
看大话设计模式中大牛对小菜的精辟点评,也写了一个计算器程序,并跟着点评一路改良,还是不过瘾,应用了类模板和异常捕捉机制重写了程序. 本文不能算干货,恰当的比方是饭前甜点,吃一口有点味.有点意思,总归太 ...