文档章节

Select2 按需加载本地/离线数据

产品哥
 产品哥
发布于 2017/05/11 15:21
字数 156
阅读 42
收藏 0
<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8" />
        <title></title>
        <link href="https://cdn.bootcss.com/select2/3.5.3/select2.min.css" rel="stylesheet">
    </head>

    <body>
        <!--<select id="test" class="form-control" style="width: 220px;"> </select>-->
        
        <input type="hidden" id="e5" style="width:300px"/>

        <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
        <!--<script src="https://cdn.bootcss.com/select2/4.0.3/js/select2.min.js"></script>-->
        
            <script src="https://cdn.bootcss.com/select2/3.5.3/select2.min.js"></script>
        <script>
            $(document).ready(function() {
                var a = [{
                        "id": 1,
                        "text": "9405"
                    },
                    {
                        "id": 2,
                        "text": "9404"
                    },
                    {
                        "id": 3,
                        "text": "9403"
                    },
                    {
                        "id": 1,
                        "text": "940501"
                    },
                    {
                        "id": 1,
                        "text": "9407"
                    },
                    {
                        "id": 1,
                        "text": "9408"
                    },
                    {
                        "id": 1,
                        "text": "9409"
                    },
                    {
                        "id": 1,
                        "text": "8501"
                    }
                ];
                

                $("#e5").select2({
                    minimumInputLength: 1,
                    query: function(query) {
                    debugger;
                        var data = {results: []};
                        for(var o in a) {
                            var p = a[o].text;
                            if(p.indexOf(query.term) >= 0) {
                                data.results.push({id: a[o].id, text:a[o].text});
                            };
                        }
                        console.log(data);
                        query.callback(data);
                    }
                });
            });
        </script>
    </body>

</html>

 

© 著作权归作者所有

产品哥
粉丝 81
博文 161
码字总数 190936
作品 1
杭州
CTO(技术副总裁)
私信 提问
我在github上下载了几个项目(如bootstrap、select2),但是本地打开docs里面的index.html等页面都不能正常渲染

我在github上下载了几个项目(如bootstrap、select2),但是本地打开docs里面的index.html等页面都不能正常渲染,想离线看看样例,不知道大家都是怎么操作的? 项目下载地址: https://gith...

陈纯均
2015/01/23
2.2K
3
离线应用——业务数据同步方案探讨

目标: 大家可以设想这样一个情景,公司已经部署信息化,且很多办公流程已经挪到线上正在运营的系统来解决,这带给企业的员工非常大的便利,节省办公时间,提高办公效率,可是我们把所有的流...

allantaylor81
2015/08/12
0
0
YII2 Select2插件使用小计

先给出文档的地址: https://www.yiiframework.com/extension/yii-select2 最近在看到很多网站给用户打标签,或者是多个下拉选择之后变成一个标签。觉得交互不错!调研发现有开源的yii-selec...

叫我哀木涕
2018/11/29
0
0
Jquery-Select2控件使用心得

前段时间使用了Select2控件处理下拉菜单,搞了一整天才搞明白,记录下心得。参考官网http://ivaynberg.github.io/select2/#documentation 该控件我使用了两种方式:1、基本用法;2、AJAX用法...

浮躁的码农
2015/12/24
184
0
select2 的加载远程数据

select2 加载远程数据的代码如下: function initGlfl() { var mapping = document.getElementById("zj").value; $("#glfl").select2( { placeholder : "请选择内容",//文本框的提示信息 mi......

jessie_lyj1
2016/09/28
87
0

没有更多内容

加载失败,请刷新页面

加载更多

关于C++ 容器的swap操作

一、swap操作交换两个相同类型的容器的内容,一般的容器(除array外),交换两个容器内容的操作会保证非常快,因为并没有交换元素本身,而只是交换了两个容器的内部数据结构。 拿vector做个例...

shzwork
4分钟前
0
0
程序员从宏观、微观角度浅析JVM虚拟机!

1.问题 1、JAVA文本文件如何被翻译成CLASS二进制文件? 2、如何理解CLASS文件的组成结构? 3、虚拟机如何加载使用类文件的生命周期? 4、虚拟机系列诊断工具如何使用? 5、虚拟机内存淘汰机制?...

我最喜欢三大框架
5分钟前
0
0
Choerodon猪齿鱼实践之应用生命周期管理

Choerodon平台中的开发和部署都是围绕应用来进行的,那Choerodon平台中的应用有什么样的特性?又是怎样来进行管理的呢?本文旨在深入地介绍Choerodon平台中应用的功能特性及其生命周期的管理...

Choerodon
25分钟前
0
0
Websocket之Jmeter压力测试

最近使用到Websocket进行聊天功能开发,用Jmeter进行压力测试,记录下。 使用的Jmeter版本5.1.1,自行从apache jmeter官网下载。 首先要添加Websocket的插件,网上有很多,我从百度网盘下载的...

克虏伯
25分钟前
0
0
作为Java程序员这些技术都不会,拿什么去涨薪跳槽?

引言 当下,正面临着近几年来的最严重的互联网寒冬,听得最多的一句话便是:相见于江湖~,缩减HC、裁员不绝于耳,大家都是人心惶惶,年前如此,年后想必肯定又是一场更为惨烈的江湖厮杀。但博...

别打我会飞
56分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部