diff --git a/js/createSelectElement.md b/js/createSelectElement.md new file mode 100644 index 0000000..7253077 --- /dev/null +++ b/js/createSelectElement.md @@ -0,0 +1,72 @@ +# Создание выпадающего списка + + + + +### Пример работы +```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("Отсутствуют элементы для выпадающего списка"); + } +} +``` \ No newline at end of file