72 lines
1.9 KiB
Markdown
72 lines
1.9 KiB
Markdown
# Создание выпадающего списка
|
||
|
||
|
||
|
||
|
||
### Пример работы
|
||
```js
|
||
attributes = {
|
||
"event":"addStatusTransport",
|
||
"attr_data":{
|
||
"brigade_id":document.getElementById("brigade_id").innerText,
|
||
"user1c_id":e.dataset.usesr1cId,
|
||
}
|
||
}
|
||
|
||
cElementBySelect(e.parentNode.nextElementSibling,status_transport,attributes);
|
||
|
||
```
|
||
|
||
|
||
```js
|
||
/**
|
||
* Создание вырадающего списка
|
||
*
|
||
* @param el - Элемент куда буде помещен созанный список
|
||
* @param data - объект с ключем и значением ([{value:text}])
|
||
* @param atttributes - Обект содержащий название события и аттридубыи data
|
||
*/
|
||
|
||
function cElementBySelect(el,data = {}, atttributes=null) {
|
||
select = document.createElement('select');
|
||
select.classList.add("form-select")
|
||
|
||
if(atttributes){
|
||
|
||
if('event' in atttributes){
|
||
|
||
select.addEventListener('change',window[atttributes.event])
|
||
}
|
||
|
||
if('attr_data' in atttributes){
|
||
|
||
Object.entries(atttributes.attr_data).forEach(([key, value]) => {
|
||
select.dataset[key] = value
|
||
});
|
||
|
||
}
|
||
}
|
||
|
||
if(Object.keys(data).length){
|
||
option = document.createElement('option');
|
||
option.value =0;
|
||
option.innerText = "";
|
||
select.append(option)
|
||
|
||
data.forEach((dt)=>{
|
||
option = document.createElement('option');
|
||
option.value =dt.value;
|
||
option.innerText = dt.text;
|
||
select.append(option)
|
||
})
|
||
|
||
elchild = el.querySelector("select") || null
|
||
|
||
if(!elchild){
|
||
el.append(select)
|
||
}
|
||
}else{
|
||
alert("Отсутствуют элементы для выпадающего списка");
|
||
}
|
||
}
|
||
``` |