Заполнение выпадающего списка данными
Приветствую всех!
Не могу понять, как обратиться к элементам списка, чтобы заполнить его через forEach. Раньше просто в таблицу добавлял поля в цикле. Выглядело это примерно так: onRefresh: function () { objHTML.setAttribute("src", "obj/0.html"); for (var i = tb.rows.length - 1; i > 0; i--) if (tb.rows[i].cells.length == 1) tb.deleteRow(i); var e = ""; if (cat.value > 0) e += `&cat_id=${cat.value}`; if (kind.value > 0) e += `&kind_id=${kind.value}`; var t = Ajax.runEval("/cult.script?cmd=obj_list" + e); t.forEach(function (n, i, arr) { var r = tb.insertRow(); r.innerHTML = `<td>${n.obj_name}</td>`; r.setAttribute("obj_lng", n.obj_lng); r.setAttribute("obj_lat", n.obj_lat); r.setAttribute("obj_id", n.obj_id); r.setAttribute("obj_name", n.obj_name); r.setAttribute("kind_name", n.kind_name); r.setAttribute("cat_name", n.cat_name); r.setAttribute("title", "Щелкните дважды для добавления в список желаний, один раз для просмотра"); r.ondblclick = OBJ.onSel; r.onclick = OBJ.onShow; }); }, <div id="t"; class="dropdown"; style="height:100%; float:left; width:25%; background:#014282; overflow: auto;"> <table id="a1" style="width: 100%; color: #fff"> <tr> <th>Категории <select ></select> Вид <select></select></th> </tr> </table> </div> Код выпадающего списка: <!DOCTYPE html> <html lang="ru"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Селект с чекбоксами</title> </head> <body style="font-size: 14px; position: relative; padding: 15px 20px;"> <div class="checkselect"> <fieldset> <legend>Культурные объекты</legend> <fieldset> <legend>Театры</legend> <label><input type="checkbox" name="brands[]" value="1" checked> Театр 1</label> </fieldset> <fieldset> <legend>Музеи</legend> <label><input type="checkbox" name="brands[]" value="2"> Музей 1</label> </fieldset> </div> <style type="text/css"> .checkselect { position: relative; display: inline-block; min-width: 200px; text-align: left; } .checkselect-control { position: relative; padding: 0 !important; } .checkselect-control select { position: relative; display: inline-block; width: 100%; margin: 0; padding-left: 5px; height: 30px; } .checkselect-over { position: absolute; left: 0; right: 0; top: 0; bottom: 0; cursor: pointer; } .checkselect-popup { display: none; box-sizing: border-box; margin: 0; padding: 0; width: 100%; height: auto; max-height: 200px; position: absolute; top: 100%; left: 0px; border: 1px solid #dadada; border-top: none; background: #fff; z-index: 9999; overflow: auto; user-select: none; } .checkselect label { position: relative; display: block; margin: 0; padding: 4px 6px 4px 25px; font-weight: normal; font-size: 1em; line-height: 1.1; cursor: pointer; } .checkselect-popup input { position: absolute; top: 5px; left: 8px; margin: 0 !important; padding: 0; } .checkselect-popup label:hover { background: #03a2ff; color: #fff; } .checkselect-popup fieldset { display: block; margin: 0; padding: 0; border: none; } .checkselect-popup fieldset input { left: 15px; } .checkselect-popup fieldset label { padding-left: 32px; } .checkselect-popup legend { display: block; margin: 0; padding: 5px 8px; font-weight: 700; font-size: 1em; line-height: 1.1; } </style> <script src="https://snipp.ru/cdn/jquery/2.1.1/jquery.min.js"></script> <script> (function($) { function setChecked(target) { var checked = $(target).find("input[type='checkbox']:checked").length; if (checked) { $(target).find('select option:first').html('Выбрано: ' + checked); } else { $(target).find('select option:first').html('Выберите из списка'); } } $.fn.checkselect = function() { this.wrapInner('<div class="checkselect-popup"></div>'); this.prepend( '<div class="checkselect-control">' + '<select class="form-control"><option></option></select>' + '<div class="checkselect-over"></div>' + '</div>' ); this.each(function(){ setChecked(this); }); this.find('input[type="checkbox"]').click(function(){ setChecked($(this).parents('.checkselect')); }); this.parent().find('.checkselect-control').on('click', function(){ $popup = $(this).next(); $('.checkselect-popup').not($popup).css('display', 'none'); if ($popup.is(':hidden')) { $popup.css('display', 'block'); $(this).find('select').focus(); } else { $popup.css('display', 'none'); } }); $('html, body').on('click', function(e){ if ($(e.target).closest('.checkselect').length == 0){ $('.checkselect-popup').css('display', 'none'); } }); }; })(jQuery); $('.checkselect').checkselect(); </script> </body> </html> |
ILS_FIST,
наверно посмотреть документацию на Ajax.runEval и туда добавить forEach. |
Часовой пояс GMT +3, время: 03:20. |