前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >使用select2分批异步加载大量数据

使用select2分批异步加载大量数据

作者头像
用户2936342
发布2018-08-27 15:29:25
1.8K0
发布2018-08-27 15:29:25
举报
文章被收录于专栏:nummynummy

最近在项目啊开发中需要从下拉列表中获取游戏ID,而后台游戏数据有将近25万条,这种情况下是不可能实现一次性加载的,只能分批异步加载。找了很多插件,都没有合适的,也想过自己做一个插件,无奈时间有限,任务比较紧,只能借助第三方插件,缩短项目时间。最终找到了select2这个插件。

html代码:

代码语言:javascript
复制
<link href="select2/select2.css" rel="stylesheet">
<link href="select2/select2-bootstrap.css" rel="stylesheet">
...
<select data-placeholder="请选择游戏..." class="select2" >
</select>
...
<script src="select2/select2.full.js"></script>

js代码

代码语言:javascript
复制
$(".select2").select2({
        theme: "bootstrap",
        allowClear: true,
        placeholder: "请选择一个游戏",
        ajax:{
            url:"/analysis/search",
            dataType:"json",
            delay:250,
            data:function(params){
                return {
                    name: params.term,
                    page: params.page || 1
                };
            },
            cache:true,
            processResults: function (res, params) {
                var games = res["data"]["games"];
                var options = [];
                for(var i= 0, len=games.length;i<len;i++){
                    var option = {"id":games[i]["gid"], "text":games[i]["gname"]};
                    options.push(option);
                }
                return {
                    results: options,
                    pagination: {
                        more:res["data"]["more"]
                    }
                };
            },
            escapeMarkup: function (markup) { return markup; },
            minimumInputLength: 1
        }
    });

flask代码

后台使用flask编写的,代码如下:

代码语言:javascript
复制
@ANALYSIS.route("/search", methods=["GET"])
def search_games():
    """
    获取游戏
    :return:
    """
    params = request.args
    name = params.get("name", None)
    page = params.get("page", 0)
    page = int(page) - 1
    skip = page * 50
    data = dict()
    if name:
        games, count = get_games_by_name(name, skip)
        data["games"] = games
        data["count"] = count
    else:
        games, count = get_first_50_games(skip)
        data["games"] = games
        data["count"] = count
    print data["count"]
    more = page * 50 < data["count"]
    data["more"] = more
    return successify(data=data)
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016.05.09 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • html代码:
  • js代码
  • flask代码
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档