今天的成果——有效多选下拉框

这个是用于自动生成多选下拉框的。贴代码,还有很多bug,有空改。 总结:拆解函数应该先写成类再拆~~

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//系统下拉多选选人功能(使用了部分单选列表的函数)

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//初始化人员多选选择列表,将选人下拉框绑定到对应的Object上

//传入值:

//o :对应的Object

//projectId :项目ID

//type :对应角色类型

function showAMultipleSelectingTaskPeopleList(o, projectId, type, callback) {

if (!isTaskPeopleListExist(projectId)) {

    initTaskPeopleList();

    getAMultipleSelectingTaskPeopleList(o, projectId, type, callback);

}

showAllTaskPeopleList(o);

$("#selectUserForProf").click(function() {

    hideAllTaskPeopleList();

    SelectUsers.init({

        rType: "cb",

        prt: "selUser",

        multiSel: false,

        onOpen: function(o) {

            SelTree();

        },

        callback: function(rs) {

            var ids = "";

            for (var key in rs) {

                selectProfWithPersonForMultiSelectList(o, rs\[key\], key);

            }

        }

    });

});

}

function appendAPersonToTaskPeopleList(o, userId, name, profId, profName) {

var appendContent = "";

appendContent = appendContent + '<li><a class="aui-list-item-link" href="javascript:;" name="' \+ name + '" id="' \+ userId

                                                        \+ '" sysProfId="' \+ profId + '">'

                                                        \+ '<input type=checkbox checked="checked" />'

                                                        \+ name + '(' \+ profName + ')</a></li>';

$("ul.aui-list-section li:first-child").before(appendContent);

showAllTaskPeopleList(o);

}

function selectProfWithPersonForMultiSelectList(o, name, id) {

var options = "";

$.get("/Foundation/Home/GetProfJson", function(data) {

    for (var x = 0; x < data.length; x++) {

        options += '<option value="' \+ data\[x\].id + '">' \+ data\[x\].name + '</option>';

    }

    box("<select id=SelectProfWithPersons>" \+ options + "</select>", { title: "请为该人员选择一个专业", contentType: 'html', cls: 'shadow-container3',

        submit_cb: function() {

            appendAPersonToTaskPeopleList(o, id, name, $("#SelectProfWithPersons").val(), $("#SelectProfWithPersons").find("option\[selected\]").text());

        }

    });

}, "json");

}

function confirmMultiplePeopleSelection(o, callback) {

var selectedTaskPeople = "";

var rd = {};

hideAllTaskPeopleList();

$(o).parent().parent().find("input\[checked\]").each(function() {

    var parentALable = $(this).parent();

    selectedTaskPeople = selectedTaskPeople + parentALable.attr("id") \+ "-" \+ parentALable.attr("sysProfId") \+ ",";

    rd\[parentALable.attr("id")\] = parentALable.attr("name");

});

selectedTaskPeople = selectedTaskPeople.substring(0, selectedTaskPeople.length - 1);

postPeopleDataSelected(o, selectedTaskPeople, rd, callback);

}

function postPeopleDataSelected(o, ids, rd, callback) {

if (ids == "") return false;

callback(ids, rd);

}

function appendAnOKButtonToTaskPeopleList(projectId, callback) {

$("ul.aui-list-section").parent().parent().append('<div style="background-color:#eff5fb; padding:5px 0;"><input id="confirmMultiplePeopleSelectionbtn" type="button" value="确定" /></div>');

$("#confirmMultiplePeopleSelectionbtn").unbind("click").bind("click", function() {

    confirmMultiplePeopleSelection(this, callback);

});

}

function switchAllCheckBoxState(o) {

var unChecked = $(o).find("input:not(:checked)");

var checked = $(o).find("input\[checked\]");

unChecked.attr("che

cked”, “checked”);

checked.removeAttr("checked");

}

function getAMultipleSelectingTaskPeopleList(o, projectId, type, callback) {

var urls = {

    getTaskPeople: '/Projects/Assignment/PlanRelatedPersonnel?r=' \+ Math.random(), //取当前项目相关人员

    searchTaskPeople: '/HumanResources/Users/SearchUsers?r=' \+ Math.random() //根据关键字查询系统用户

}

$.getJSON(urls.getTaskPeople, { projId: projectId, type: type }, function(data) {

    if (data.Success) {

        var taskPeopleList = "";

        $("ul.aui-list-section").html("");

        $("ul.aui-list-section").attr("projId", projectId);

        $(data.Items).each(function() {

            taskPeopleList = taskPeopleList + '<li><a class="aui-list-item-link" href="javascript:;" name="' \+ this.name + '" id="' \+ this.id

                                                        \+ '" sysProfId="' \+ this.sysProfId + '">'

                                                        \+ '<input type=checkbox />'

                                                        \+ this.name + '(' \+ this.sysProfName + ')</a></li>';

        });

        $("ul.aui-list-section").append(taskPeopleList);

        $("ul.aui-list-section").find("a").each(function() {

            $(this).click(function() {

                switchAllCheckBoxState(this);                //点击checkBox本身反而不会被选中,估计是checkBox的事件和本方法直接抵消了

            });

        });

        appendAnOKButtonToTaskPeopleList(projectId, callback);

    } else {

        $("ul.aui-list-section").append('<li>' \+ data.Message + '</li>');

    }

});

}

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//系统下拉多选选人功能

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

.csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, “Courier New”, courier, monospace; background-color: #ffffff; /white-space: pre;/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }