select2插件的使用

来源:互联网 发布:js 时间戳格式化函数 编辑:程序博客网 时间:2024/05/05 08:36

var format = function(item) { //被选择后显示的内容
        return item.userName + "   " + item.text;
    };
    var noMatchesTip = function() {
        return Resource.dayangEmail;
    };
    var noTip = function(){
        return '';
    };
    $('#author').select2({
        multiple: true,
        minimumInputLength: 1, //至少要输入一个字符才开始搜索
        separator: ' ', // 默认是,
        formatSearching:noTip,
        formatInputTooShort:noTip,
        formatResult:format, //下拉框显示的内容
        formatSelection:format,  //被选择后显示的内容
        formatNoMatches:noMatchesTip,
        dropdownCssClass: "bigdrop",
        ajax: {
            url: $('#initPath').val() + '/UserController.do?method=getUserByEmail&timeStamp=' + new Date().getTime(),
            dataType: 'json',
            quietMillis: 100,
            data: function (term, page) { //参数 ,需要对用户输入内容进行过滤(只许输入英文、数字、下划线、@字符)
                var lastIndex = term.lastIndexOf("@");
                var result = "";
                if(lastIndex == -1){ //没有输入@
                    result = term.replace(/[^\w_]/ig, '');
                } else {        //若有多个@,则只保留第一个@,后面的全部过滤掉
                    var suffix = term.substring(0, lastIndex);
                    var suffixResult = suffix.replace(/[^\w_]/ig, '');
                    var lastResult = term.substring(lastIndex);
                    result = suffixResult + lastResult;
                }
                return {
                    email: result
                }; //字符\w   意义:匹配所有的数字和字母以及下划线,等价于[A-Za-z0-9_]。


            },
            results: function (data, page) {
                return {
                   results: data.select2List
                };
            }
        }
    });
    //支持可拖拽
    $("#author").select2("container").find("ul.select2-choices").sortable({
        containment: 'parent',
        start: function() {
            $("#author").select2("onSortStart");
        },
        stop: function() {
            $("#author").select2("onSortEnd");
        }
    });



后台:

 //将用户信息转化为Select2对象集合后返回(需要是json对象)
    public static List<Select2> getSelect2List(List<DYRKBUser> userList) {
        List<Select2> select2List = new ArrayList();
        for(DYRKBUser ut:userList){
            Select2 select2 = new Select2();
            select2.setId(ut.getEmail());
            select2.setText(ut.getEmail());
            select2.setUserName(ut.getUserName());
            select2List.add(select2);
        }
        return select2List;
    }


参考官网:http://ivaynberg.github.io/select2/#basics

0 0
原创粉丝点击