Добрый день, коллеги.
Прошу помочь с проблемой - как правильно очищать предыдущий выбор в выпадающем списке Bootstrap (вып.список реализован через asp:ListBox)?
HTML5 |
1
| <asp:ListBox ID="UpdateCrash_cause_ddl" CssClass="showtooltip dropdownCtrl" runat="server" SelectionMode="Multiple"></asp:ListBox> |
|
Общая картина такая. На странице нагенеренная таблица, при клике на строке таблицы выходит модаль Bootstrap'а. Модаль содержит выпадающий список, с которым и нужно работать. Как прочитать значения из ячейки таблицы в выпадающий список (для выбора только нужных опшинов) я понял. Но если я закрываю модаль и кликаю по другой строке таблицы - в выпадающем списке сохраняется предыдущий выбор, что некорректно.
Код примерно такой:
Кликните здесь для просмотра всего текста
Javascript |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| //Клик по строке таблицы
$(".ElementLineToRead").click(function () {
//Проверим активна ли кнопка завершения.
var valueOfButtonActivity = $(this).parents("tr").find(".CloseThisCrash").attr("disabled");
if (valueOfButtonActivity == "disabled") {
return false;
}
//Наименование в модельный хеадер
$(".elementName_toUpdate").text($(this).parents("tr").find(".EquipLink").text());
//прочие манипуляции со значениями.....
//Здесь я считываю значение из ячейки кликнутой строки (например, "имя1,имя2")
var cause_forUpdate = $(this).parents("tr").find(".Cause").text();
//Мультиселект подсасывает нужные значения
valArr = cause_forUpdate.split(",");
for (i = 0; i < valArr.length; i++) {
$("#UpdateCrash_cause_ddl").find("input [value='" + valArr[i] + "']").addClass("active");
$("#UpdateCrash_cause_ddl option[value='" + valArr[i] + "']").attr("selected", 1);
$("#UpdateCrash_cause_ddl").multiselect("refresh");
}
//Читаю прочие ячейки для подстановки значений......
$(".modalDialog_Edit").modal("show");
}); |
|
При первом клике на строке значение показывается правильно, например в вып.списке выделено "Имя1,Имя2". Потом я кликаю по другой строке, где ячейка содержит "Имя3" - а в вып.списке вижу выделенным "Имя3,Имя1,Имя2"(!).
Как только не мудрил, не могу исправить =(( Пример под катом (этот вариант при первом клике возвращает правильное значение, при последующих отображает "Не выбрано")
Кликните здесь для просмотра всего текста
Javascript |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| valArr = cause_forUpdate.split(",");
var toDeselect = [];
$("option", "#UpdateCrash_cause_ddl").each(function () {
for (i = 0; i < valArr.length; i++) {
var this_option = $(this).val().toString();
var toUpdate = valArr[i].toString();
if (this_option == toUpdate) {
$("#UpdateCrash_cause_ddl").find("input [value='" + toUpdate + "']").addClass("active");
$("#UpdateCrash_cause_ddl option[value='" + toUpdate + "']").attr("selected", true);
$("#UpdateCrash_cause_ddl").multiselect("refresh");
}
else {
toDeselect.push(this_option);
}
}
});
$("#UpdateCrash_cause_ddl").multiselect('deselect', toDeselect); |
|
Добавлено через 2 часа 25 минут
Методом тыка решение нашлось:
Javascript |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| valArr = cause_forUpdate.split(",");
$("#UpdateCrash_cause_ddl").multiselect('deselectAll', false);
$("#UpdateCrash_cause_ddl").parents("p").find("input").each(function () {
for (i = 0; i < valArr.length; i++) {
var this_option = $(this).val().toString();
var toUpdate = valArr[i].toString();
if (this_option == toUpdate) {
$("#UpdateCrash_cause_ddl").find("input [value='" + toUpdate + "']").addClass("active");
//.prop вместо .attr (!)
$("#UpdateCrash_cause_ddl option[value='" + toUpdate + "']").prop("selected", true);
$("#UpdateCrash_cause_ddl option[value='" + toUpdate + "']").selected=true;
$("#UpdateCrash_cause_ddl").multiselect("refresh");
}
}
}); |
|
Топег клоузд