Нажмите значения для множественного выбора
Мне нужно подтолкнуть значения, которые я получаю из базы данных, к множественному выбору. Код ниже будет помещать данные в текстовую область в зависимости от изменения выбора. Мне нужно изменить текстовую область на множественный выбор. Как этого добиться? Вызов метода ниже, например
HTML
<select id = "select-execution-group-update" class = "form-control" onchange = "getParamListForCustomGroupUpdate()">
// JS файл
function getParamListForCustomGroupUpdate() {
var selected_execution_group = document.getElementById("select-execution-group-update").value;
$.ajax({
method: "GET",
dataType: "text",
url: "getObjectList",
data: {
execution_group_name: selected_execution_group
},
success: function (result) {
result = result.replace(/\/g, "");
document.getElementById("object_custom_name").value = result;
}
}
);
}
да. , Устройство-1, Устройство -2, Устройство-3
@ Raja1983, не могли бы вы прислать мне образец ответа, чтобы я мог дать вам точный ответ.
да. результат: Device.10001.Enable \, Device.WiFi.AccessPoint.101 \, Device.WiFi.AccessPoint.101.Security \
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
function getParamListForCustomGroupUpdate() {
var selected_execution_group = document.getElementById("select-execution-group-update").value;
$.ajax({
method: "GET",
dataType: "text",
url: "getObjectList",
data: {
execution_group_name: selected_execution_group
},
success: function (result) {
// result in array
result = result.replace(/\/g, "");
referenceNode = document.getElementById("object_custom_name");
//document.getElementById("object_custom_name").value = result;
var myDiv = document.getElementById("myDiv");
//Create and append select list
var selectList = document.createElement("select");
selectList.id = "mySelect";
myDiv.appendChild(selectList);
//Create and append the options
for (var i = 0; i < result.length; i++) {
var option = document.createElement("option");
option.value = result[i];
option.text = result[i];
selectList.appendChild(option);
}
referenceNode.parentNode.insertBefore(myDiv, referenceNode.nextSibling);
}
}
получение массива не определено
Вам просто нужно заменить текстовую область на множественный выбор и добавить значение в этот множественный выбор.
<select id = "select-execution-group-update" class = "form-control" onchange = "getParamListForCustomGroupUpdate()">
<select id='multi-select' ...>
//JS file
function getParamListForCustomGroupUpdate() {
var selected_execution_group = document.getElementById("select-execution-group-update").value;
$.ajax({
method: "GET",
dataType: "text",
url: "getObjectList",
data: {
execution_group_name: selected_execution_group
},
success: function (result) {
result = result.replace(/\/g, "").split(',');
var arrayLength = result.length;
for (var i = 0; i < arrayLength; i++) {
var option = document.createElement("option");
option.text = result[i];
option.value = result[i];
var select = document.getElementById("multi-select");
select.appendChild(option);
}
}
}
);
Поставляется как отдельная опция., Устройство1, устройство 2, устройство 3.
@ Raja1983 вы можете попробовать прямо сейчас.
@ Raja1983 и примите ответ, если он работает сейчас.
Спасибо.Получена ошибка Uncaught TypeError: невозможно прочитать свойство appendChild со значением NULL.
Я обнаружил проблему. Она появляется, но идет отдельными буквами.
@ Raja1983, не могли бы вы поделиться значением переменной результата, распечатав его на консоли.
<option value = "D"> D </option>, <option value = "e"> e </option>
Я не мог скопировать результаты. Инструменты разработчика, которые я видел выше.
что возвращает данные действия getObjectList? @ Raja1983
результат: Device.10001.Enable \, Device.WiFi.AccessPoint.101 \, Device.WiFi.AccessPoint.101.Security \
@ Raja1983 добавьте это в конец строки gsub .split (',')
Как очистить значения в select.Каждый раз я буду получать новые значения.Если я выберу Test, он будет выдавать другое значение, если я выберу тестирование, оно будет выдвигать другое значение.Каждый раз выбор мне нужно очистить множественный выбор
document.querySelectorAll ('# multi-select option'). forEach (option => option.remove ()) добавить эту строку перед var select = .... @ Raja1983
Я удалил.
Что в результате ajax? Это массив? Можете показать результат?