zoukankan      html  css  js  c++  java
  • select2插件的使用

     <select id="prd_tech_for_load" class="selectable" style="180px;">
    </select>

    不需要分页时,直接在select内添加option列表

    如果要分页的话

    $(function () {
        $("#prd_tech_for_load").select2();
        var sel_tech = $("#prd_tech_for_load").select2({
            placeholder: abp.localization.values['ICT'].SelTechReq,
            ajax: {
                url: '../PDE/GetProductList',
                dataType: 'json',
                delay: 250,
                data: function (params) {
                    return {
                        queryText: params.term // search term
                    };
                },
                processResults: function (data, params) {
                    params.page = params.page || 1;
                    return {
                        results: data.result.data,
                        pagination: {
                            more: 1 < data.totalPages
                        }
                    };
                },
                cache: true
            },
            //disabled: true,
            escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
            minimumInputLength: 0,
            templateResult: function (item) { // 显示查询结果
                var display = '';
                if (item.technology != null) display += item.technology;
                //if (item.customerName != null) display += '(' + item.customerName + ')';
                return display;
            },
            templateSelection: function (item) { // 显示选中的对象
                var display = '';
                if (item.technology != null) display += item.technology;
                if (item.customerName != null) display += '(' + item.customerName + ')';
                return display || item.text;
            }
        });
    
        sel_tech.on("select2:select", function (e) {
            defaultVue.ProductID = e.params.data.productId;
        });
    });

    这里要注意的一个问题是,后台返回的数据列表必须含有id这个字段,不然会出现问题,一直不能选中数据。

    这个不知道的人,被坑死了!

  • 相关阅读:
    Hive问题
    VirtualBox安装增强功能
    Shell脚本 数据清洗
    团队项目第一阶段冲刺站立会议06
    梦断代码阅读笔记1
    团队项目第一阶段冲刺站立会议05
    团队项目第一阶段冲刺站立会议04
    团队项目第一阶段冲刺站立会议03
    团队项目第一阶段冲刺站立会议02
    团队项目第一阶段冲刺站立会议01
  • 原文地址:https://www.cnblogs.com/hongdada/p/6149493.html
Copyright © 2011-2022 走看看