fleet-contractor/Site/js/editmultiselect.js

var ALL_TEXT = "(All)";
var paramindex = -1;
function editmultiselect(param) {
    var divcontrol = $('<div class="div_filter"></div>');
    var seldiv = $('<div class="left dropdown"></div>');
    var span = $('<span class="text_span"></span>');
    var spanimg = $('<span class="fa dropdown_button">&#xf078;</span>');
    var divpanel = $('<div class="div_panel" style="display: none;z-index:10;margin-top:20px;margin-left:-1px;"></div>');
    divpanel.data("self", divpanel);
    if (param.width && param.width > 0)
        divpanel.css('width', param.width);

    $(document).mousedown(function (e) {
        var t = $(e.target);
        $('.div_panel').each(function () {
            if (!t.is(divpanel)
                && !t.parent().is(divpanel)
                && !t.parent().parent().is(divpanel)
                && !t.parent().parent().parent().is(divpanel)) {
                var v = divpanel.is(":visible");
                divpanel.hide();
                if (v && param.oncompleted)
                    param.oncompleted();
            }
        });
    });

    divpanel.completed = function () {
        if (param.oncompleted)
            param.oncompleted();
    }

    var inputctrl;
    //if (param.allowsearch === true) {
    var inputdiv = $('<div  style="margin:3px;"></div>');
    divpanel.append(inputdiv);
    inputctrl = $('<input maxlength="100" style="padding-top:0;padding-bottom:0;width:96%;" />');
    inputctrl.bind('input propertychange', function () { changeSearchvalue(this); });
    inputdiv.append(inputctrl);
    //}

    var ul = $('<ul></ul>');
    divpanel.append(ul);
    ul.mousedown(false);
    seldiv.append(span).append(spanimg).append(divpanel);
    divcontrol.append(seldiv);

    var ctrlclick = function () {
        $('.div_panel').each(function (e) {
            var t = $(this);
            var v = t.is(":visible");
            if (!t.is(divpanel)) {
                t.css('display', 'none');
                if (v)
                    t.data("self").completed();
            }
        });

        var display = divpanel.css('display');
        if (display == 'none') {
            divpanel.css({ 'display': 'block' });
        } else {
            divpanel.css('display', 'none');
        }
        return false;
    }
    span.mousedown(ctrlclick);
    spanimg.mousedown(ctrlclick);

    var itemclick = function (isall, checked) {
        var chks = ul.find('input');
        if (isall) {
            chks.prop('checked', checked);
            if (checked) {
                span.attr('title', ALL_TEXT).text(ALL_TEXT);
            }
            else {
                span.attr('title', "").text("");
            }
            param.selectedvalue = [];
            param.selecteditems = [];
            return;
        }
        else {
            if (chkall)
                chkall.prop('checked', false);//(ALL)取消选中
        }

        var texts = [];
        var paramvalues = [];
        var paramitems = [];
        for (var i = 0; i < chks.length; i++) {
            var c = $(chks[i]);
            if (c.prop('checked')) {
                var text = c.next('label').text();
                if (!text) text = c.data("value");
                texts.push(text);
                paramvalues.push(c.data("value"));
                paramitems.push(c);
            }
        }
        texts = texts.join(', ');
        span.attr('title', texts).text(texts);
        param.selectedvalue = paramvalues;
        param.selecteditems = paramitems;
    };

    divcontrol.setValues = function (values) {
        var chks = ul.find('input');

        for (var i = 0; i < chks.length; i++) {
            var chk = $(chks[i]);
            if (values.indexOf(chk.data("value")) >= 0)
                chk.prop('checked', true);
            else
                chk.prop('checked', false);
        }

        var texts = [];
        var paramvalues = [];
        var paramitems = [];
        for (var i = 0; i < chks.length; i++) {
            var c = $(chks[i]);
            if (c.prop('checked')) {
                var text = c.next('label').text();
                if (!text) text = c.data("value");
                texts.push(text);
                paramvalues.push(c.data("value"));
                paramitems.push(c);
            }
        }
        texts = texts.join(', ');
        span.attr('title', texts).text(texts);
        param.selectedvalue = paramvalues;
        param.selecteditems = paramitems;
    }

    var chkall = undefined;
    var showItems = function (searchtext) {
        ul.empty();
        if (param.allowall !== false) {
            var liall = $('<li></li>');
            chkall = $('<input type="checkbox" style="width:16px;"/>');
            chkall.change(function () {//全选
                itemclick(true, $(this).prop('checked'));
            });
            liall.append(chkall);
            liall.append($('<label for="chkall"></label>').text(ALL_TEXT));
            ul.append(liall);
        }

        if (param && param.items) {
            var texts = [];
            for (var s = 0; s < param.items.length; s++) {
                var item = param.items[s];
                var value = item[param.valuepath || "Key"];
                var txt = item[param.textpath || "Value"];
                var li = $('<li></li>').data("item", item);
                var chk = $('<input type="checkbox" style="width:16px;"/>').data("value", value).attr("id", "chkp" + ++paramindex);
                if (item.sublevel > 0)
                    chk.css("margin-left", "" + (20 * item.sublevel) + "px");
                chk.change(function () {
                    itemclick(false, $(this).prop('checked'));
                });
                li.append(chk);
                var lbl = $('<label for=' + ("chkp" + paramindex) + '></label>').text(txt)
                li.append(lbl);
                ul.append(li);
            }
            texts = texts.join(', ');
            span.attr('title', texts).text(texts);

            divcontrol.setValues(param.selectedvalue);
        }
    }

    var filterItems = function (searchtext) {
        if (!searchtext)
            searchtext = "";
        searchtext = $.trim(searchtext);
        ul.find("li").each(function () {
            var li = $(this);
            var item = li.data("item");
            if (item) {
                var txt = item[param.textpath || "Value"];
                if (searchtext != "" && txt.toLowerCase().indexOf(searchtext.toLowerCase()) < 0)
                    li.hide();
                else
                    li.show();
            }
        })
    }

    //搜索
    function changeSearchvalue(obj) {
        var inp = $(obj);
        var text = inp.val();
        filterItems(text);
    }

    divcontrol.reset = function () {
        if (inputctrl)
            inputctrl.val("");
        showItems();
        itemclick(true, false);
    }

    showItems();

    return divcontrol;
}