Jquery Selected - автозаповнення вибраних даних на самому завантаженні - jquery, jquery-plugins, випадаюче меню, вибране jquery

Я використовував модуль Jquery Chosen Plugin у своїй програмі.

У мене на сторінці містяться 2 спадні місця Категорія ---> звичайне спадне меню (містить усі категорії) AttributeList -> Вибране спадне меню (містить усі атрибути)

Кожна категорія має кілька атрибутів, пов’язаних із списку AttributeList. Припустимо, у нас є 10 категорій та 40 атрибутів. Приклад категорії A пов'язаний з 4 атрибутами (Attr1, Attr2, Attr3 і Attr4)

Коли ми вибираємо категоріюA зі спадного меню категорії,список (Attr1, Attr2, Attr3 і Attr4) повинен завантажуватиметься у спадне меню AttributeList і буде вимкнено з 40 атрибутів, що відображається при натисканні на вибране спадне меню.

---

CateoryA --- вибрано в категорії DropDown

---

Attr1 X Attr2 X Attr3 X Attr4 X ---> AttributeList Вибране спадне меню

---

Attr1 - вимкнено Attr2 - вимкнено Attr3 - вимкнено Attr4 - вимкнено Attr5 - включений стан Attr39 - включений стан Attr40 - включений стан

---

Як ми можемо реалізувати автоматичне заповнення при завантаженні сторінки / зміні вибору спаду для обраного спаду.

Будь ласка, допоможіть, як мені потрібно, щоб якомога швидше це здійснити. Принаймні, допоможіть мені у наданні будь-якої документації обраного плагіна.

Відповіді:

0 для відповіді № 1

Мій код знаходиться як на сторінці cshtml (aСпадне меню "Категорія" та "txtAttributes" є обраним спадом) В даний час він заповнюється порожнім. Але мені потрібно щонайменше, щоб деякі з них мали заповнити себе на навантаженні на основі логіки.

На сторінці CSHTML

   <div class="row clear">
<div class="span2">
Category:</div>
<div class="span8">
<select id="Category" multiple="multiple">
</select>
</div>
</div>
<div class="span2">
Attributes:</div>
<div class="span8">
<select id="txtAttributes" style="display: none;"
data-placeholder="Select Attribute"  multiple="multiple"
class="chosen-select-width" tabindex="-1"></select>
</div>

Файл Javascript містить

    $.ajax({
url: cexPortal.getAbsoluteURL("CMS/Attribute/ListJson"),
type: "GET",
data: "",
success: function (data) {
var AttributeList = data.List;

$(document).data("AttributeList", AttributeList);

$("#txtLinkAttributesToCategory").empty();

$.each(AttributeList, function (i, data) {
$("#txtAttributes").append("<option value="" + data.StructureId + "">" + data.StructureName + "</option>");
});

var config = {
".chosen-select": {},
".chosen-select-deselect": {
allow_single_deselect: true
},
".chosen-select-no-single": {
disable_search_threshold: 10
},
".chosen-select-no-results": {
no_results_text: "Oops, nothing found!"
},
".chosen-select-width": {
width: "95%"
}
}
$(document).data("ChosenConfig", config);

for (var selector in config) {
$(selector).chosen(config[selector]);
}
}
});

---

0 для відповіді № 2

Будь ласка, використовуйте вибраний api, динамічно вибирайте вибране значення.

$("#kpiselect").val(["Attr1","Attr2","Attr3","Attr4"]).trigger("chosen:updated");

---