多選下拉框帶搜索（aps.net）

自己寫了一個帶搜索功能的多選下拉框，為了要獲取值，就沒有封裝插件，實現思路

 

1.一個文本框 做搜索

2.一個文本框顯示選中文本，一個隱藏控件存值

3.一個div里面綁定CheckBoxList控件（這里，你也可以請求后直接插入checkbox）

代碼

1.一個變量把div的html存起來

2.選中就加到文本框，取消就減掉

//選中記錄，反選刪除
$("#divChkList :checkbox").each(function () {
$(this).click(function () {
var $txtList = $("#txtList");
if (this.checked) {
$txtList.val($txtList.val() + $(this).next().text() + ",");
$("#hid_id").val($("#hid_id").val() + $(this).val() + ",");
}
else {
$txtList.val($txtList[0].value.replace($(this).next().text() + ',', ''));
$("#hid_id").val($("#hid_id").val().replace($(this).val() + ',', ''));
}
});
});

3.搜索

//判斷是否包含，包含則選中
if ($("#txtList").val().indexOf($(this).next().text()) > -1) {
$(this).attr("checked", true);
}
else {
$(this).attr("checked", false);
}

 

//全選反選

//全選/反選
function allcb() {
if ($("#all").attr("checked") == "checked") {
$("#divChkList :checkbox").each(function () {
$(this).attr("checked", true);
var $txtList = $("#txtList");
if ($txtList.val().indexOf($(this).next().text()) == -1) {
$txtList.val($txtList.val() + $(this).next().text() + ",");
$("#hid_id").val($("#hid_id").val() + $(this).val() + ",");
}
});
}
else {
$("#divChkList :checkbox").each(function () {
$(this).attr("checked", false);
});
$("#txtList").val("");
$("#hid_id").val("");
}
}

具體代碼：

http://download.csdn.net/detail/jine515073/9445968