select2的远程加载非分页实例
$("#c01-select").select2({
ajax: {
url: "data.json",
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term,
};
},
processResults: function (data) {
var items=data.mapList; //json数组
var itemList = [];
for(var i =0; i < items.length; i++){
itemList.push({id: items[i].id, text: items[i].name});
}
/或者
*$.each(items,function(index,item){
temList.push({id: item.id, text: item.name});
})*/
return {
results: itemList
};
},
cache: true
},
escapeMarkup: function (markup) { return markup; },
minimumInputLength: 1,
templateResult: formatRepo,
templateSelection: formatRepoSelection
});
说明:
1.q: params.term 查询参数(params.term表示输入框中内容,q发生到服务器的参数名)
2.processResults中results: data返回数据(返回最终数据给results,如果我的数据在data.res下,
则返回data.res。这个与服务器返回json有关)
3.minimumInputLength 最小需要输入多少个字符才进行查询,与之相关的maximumSelectionLength表示
最大输入限制。
4.escapeMarkup字符转义处理
5.templateResult返回结果回调function formatRepo(repo){return repo.text},这样就可以将返回结
果的的text显示到下拉框里,当然你可以return repo.text+"1";等
6.templateSelection选中项回调function formatRepoSelection(repo){return repo.text}
7.关于返回的 json的格式:select2默认json格式为[{id:1,text:'text'},{id:2,text:'text'}],新版
严格要求这样的格式,当然你可以添加列,如:[{id:1,text:'text',name:'liu'}]
五.获取选中项
var res=$("#c01-select").select2("data")[0] ; //单选
var reslist=$("#c01-select").select2("data"); //多选
if(res==undefined)
{
alert("你没有选中任何项");
}
if(reslist.length)
{
alert("你选中任何项");
}
select2的远程加载非分页实例的更多相关文章
- 在Unity中创建可远程加载的.unity3d包
在一个Unity项目中,发布包本身不一定要包括所有的Asset(译为资产或组件),其它的部分可以单独发布为.unity3d,再由程序从本地/远程加载执行,这部分不在本文讨论范围.虽然Unity并没有直 ...
- EasyUI - DataGrid 组建 - [ 组件加载和分页 ]
效果: 原理:通过POST传递到数据后台字段. 此时上传的参数,page:当前页数,rows:每页显示的页数. 有此两项参数,计算取出数据条数. 通过后台接受参数,进行处理并返回抽取的数据. html ...
- bootstrap模态框远程加载网页的正确处理方式
bootstrap模态框远程加载网页的方法 在bootsrap模态框文档里给出了这个方法: 使用链接模式 <a data-toggle="modal" href=" ...
- 模拟jQuery中的ready方法及实现按需加载css,js实例代码
这篇文章介绍了模拟jQuery中的ready方法及实现按需加载css,js实例代码,有需要的朋友可以参考一下 一.ready函数的实现经常用jQuery类库或其他类库中的ready方法,有时候 ...
- Ext2.0之Tabpanel AJAX远程加载多标签页面模式开发技巧
目前开发的方式是采用远程load页面来实现多页面效果,类似于126邮箱多标签页效果.但是比126邮箱的方式更好,因为页面打开后是load到本地的,126似乎还会重新请求.在近期项目该开发方式已经基本成 ...
- CSS远程加载字体
CSS 远程加载字体的方法,做网站CSS的都知道,用户浏览网站时,网页上的字体是加载本地的.换言之,如果网站使用了用户电脑所没有安装的字体,那显示字体就会被默认字体所代替了,自然效果就大受影响了. 上 ...
- Bootstrap Modal 使用remote从远程加载内容
Bootstrap的Modal这个模态窗组件还是很好用的,但在开发的过程中模态窗中的内容大部分都是从后端加载的.要实现模态窗的内容是从后端加载话,常用的实现方式有2种.它们是: (1) ...
- 字节码加载和class实例的顺序问题
刷头条的时候看到了这个: 你做会错的一道Java面试题:字节码加载和class实例的顺序问题 以前也看到过,应该是阿里的校招笔试题,当时懒得理这种工作中毫无意义的东西. 今天突然来了兴趣,就想看看能 ...
- RecyclerView 判断滑到底部 顶部 预加载 更多 分页 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
随机推荐
- iOS 跳转到Appstore的链接及二维码
1.应用内部跳转到Appstore 1.跳转到应用详情 [[UIApplication sharedApplication]openURL:[NSURL URLWithString:@"it ...
- X86/X64处理器体系结构及寻址模式
由8086/8088.x86.Pentium发展到core系列短短40多年间,处理器的时钟频率差点儿已接近极限.尽管如此,自从86年Intel推出386至今除了添加一些有关流媒体的指令如mmx/sse ...
- IOS UIlabel 、UIButton添加下划线
1.给UILabel 添加下划线 UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(, , , )]; label.backgrou ...
- Java多线程系列 基础篇04 线程中断
1. 中断线程 中断可以理解为线程的一个标志位属性,它表示一个运行中的线程是否被其他线程进行了中断操作,其他线程通过调用该线程的interrupt()方法对其进行中断操作,线程通过检查自身是否被中断来 ...
- vuex原理笔记
本文总结自: https://tech.meituan.com/vuex-code-analysis.html, 将要点提炼为笔记,以便不时之需,安不忘危. 核心可分为两部分: 1.vue.use(V ...
- Spring当中的名称装配和类型装配有什么区别?
6 人赞同了该回答 Spring auto-wire的 五种方式:1:no 默认的方式是不进行自动装配,通过手工设置ref 属性来进行装配bean2:byName 通过参数名 自动装配,如果一个bea ...
- Kafka0.7运行时报错 kafka/javaapi/consumer/ConsumerConnector : Unsupported major.minor version 51.0 解决
目前中央库中 org.apache.kafka 是用jdk1.7编译的, 故跑在1.6的jvm中会报错 解决方案: 1. 下载kafka源码, 本地sbt进行install, 编译前 java -ve ...
- LightOJ 1132 Summing up Powers:矩阵快速幂 + 二项式定理
题目链接:http://lightoj.com/volume_showproblem.php?problem=1132 题意: 给定n.k,求(1K + 2K + 3K + ... + NK) % 2 ...
- hihocoder1075【开锁魔法】
hihocoder1075[开锁魔法] 题意是给你一个 \(1-n\) 的置换,求选 \(k\) 个可以遍历所有点的概率. 题目可以换个模型:有 \(n\) 个球,有 \(cnt\) 种不同的颜色,求 ...
- web性能压力测试工具http_load/webbench/ad
http_load 下载地址:http://www.acme.com/software/http_load/http_load-12mar2006.tar.gz 程序非常小,解压后也不到100K 居家 ...