Asmselect и изменение выбранного статуса опции с помощью Javascript
Я пытаюсь сделать довольно простую задачу в asmselect без удачи.
У меня есть список множественного выбора, используя asmselect. Ни один из вариантов не выбран изначально.
<select multiple="multiple" id="myselectdiv" name="myselectdiv[]" title="choose">
<option value="0">zero</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
</select>
Asmselect инициализирован правильно, и я могу наблюдать, как элементы отображаются ниже, когда я выбираю их вручную.
Я хочу использовать Javascript или jQuery, чтобы динамически изменять выбранный статус одного из параметров на "выбранный", не нажимая этот параметр. Это действительно просто:
document.getElementById('myselectdiv').options[3].selected=true;
Когда я пытаюсь сделать это в списке множественного выбора с инициализацией asmselect, ничего не происходит. Я хочу, чтобы JavaScript выбрал элемент и отобразил его ниже, как это происходит при ручном нажатии на него с помощью asmselect.
Та же проблема на Safari 5 и Firefox 21, MacOS. Любая помощь приветствуется.
1 ответ
После некоторых экспериментов я смог решить проблему. Я выкладываю решение на случай, если у кого-то возникнет такая же проблема.
Документация описывает инициализацию asmSelect во время загрузки документа, например:
$(document).ready(function() {
$("select[multiple]").asmSelect({
addItemTarget: 'bottom',
animate: true,
highlight: true,
sortable: true
});
});
Но если вы планируете динамически заполнять и / или изменять выбранные элементы с помощью javascript, после загрузки страницы asmSelect необходимо не инициализировать при внесении изменений, а затем повторно инициализировать. Например:
function something() {
[do some ajax]
// remove the asmSelect attachment to the select list
$(".asmSelect").remove(); $(".asmList").remove();
//change some selections in the list with Javascript
document.getElementById('myselectlist').options[3].selected=true;
// re-initialize asmSelect
$(document).ready(function() {
$("select[multiple]").asmSelect({
addItemTarget: 'bottom',
animate: true,
highlight: true,
sortable: true
});
});
}
В целом я очень доволен asmSelect и надеюсь, что этот пост будет полезен для других, внедряющих инструмент.