Доброго времени суток! С JS работаю совсем недавно. Прошу помочь в решении ситуации: есть некий индексный файл, содержащий необходимые функции и элементы интерфейса, в т.ч. и злополучный список. содержимое списка берется из php-обработчика (actlist.php), который, в свою очередь, берет элементы списка из базы. Задача: нажимая на кнопку "Обновить список", получать от обработчика новые элементы (не перезагружая всю страницу) и представлять все это в виде простого выпадающего списка. Вот тут-то и проблема: не могу никак добится нормальной html-формы, на страницу выводится html-код, но в виде простого текста: Код (Text): <select id = 'lex_act_id1' name = 'lex_act_id1'><option value = '0'>Выберите<option value = '6'>Объект 1 <option value = '3'>Объект 2 <option value = '4'>Объект 3 <option value = '5'>Объект 4 <option value = '2'>Объект 5 <option value = '1'>Объект 6 </select> как бы его заставить обработать этот выдаваемый html? сил моих больше нет краткие листинги: Код (Text): <script type="text/javascript" src="text-utils.js"> </script> <script language="javascript" type="text/javascript"> var request = null; function createRequest() { try { request = new XMLHttpRequest(); } catch (trymicrosoft) { try { request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (othermicrosoft) { try { request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { request = null; } } } if (request == null) alert("Error creating request object!"); } function getActList() { createRequest(); var url = "actlist.php"; request.open("GET", url, true); request.onreadystatechange = updatePage; request.send(null); } function updatePage() { if (request.readyState == 4) { var newTotal = request.responseText; var ActList = document.getElementById("act-list"); replaceText(ActList, newTotal); } } </script> </head> <body> ........ <span id="act-list"> </span> <form method="GET"> <input value="Обновить список" type="button" onClick="getActList();" /> </form> содержание файла text-utils.js: Код (Text): function replaceText(el, text) { if (el != null) { clearText(el); var newNode = document.createTextNode(text); el.appendChild(newNode); } } function clearText(el) { if (el != null) { if (el.childNodes) { for (var i = 0; i < el.childNodes.length; i++) { var childNode = el.childNodes[i]; el.removeChild(childNode); } } } } function getText(el) { var text = ""; if (el != null) { if (el.childNodes) { for (var i = 0; i < el.childNodes.length; i++) { var childNode = el.childNodes[i]; if (childNode.nodeValue != null) { text = text + childNode.nodeValue; } } } } return text; } содержание файла actlist.php: Код (Text): <? require_once('functions.php'); ?> <?php $act_array = get_act($lex_act_id); display_act($act_array, @$lex_act_id, $all = 1); ?>
Так вы же сами говорите: [js]var newNode = document.createTextNode(text);[/js] мол, хочу текстовый узел. Вот он и выводится текстом. Тут надо юзать innerHTML или insertAdjacentHTML/createContextualFragment (последнее не особо кроссбараузерно, зато по стандарту )
да, я изменил функцию на: [js] function replaceText(el, text) { if (el != null) { el.innerHTML = text; } }[/js] все заработало. только вот теперь, если на странице больше одной подобной формы, то работает все это дело (передача переменных обработчику для внесения в базу) только в сафари в файрфоксе, а уж, тем более, в ИЕ - передаются пустые значения.
я делал проще, везде работает. если по минимому, безо всяких проверок и установления выбранных значений, то так: [js] var listArray = originalRequest.responseText.split(","); var lst = document.getElementById("city"); lst.innerHTML=""; for(var i=0; i<listArray.length; i+=2){ o=document.createElement('option'); o.text=listArray[i+1]; o.value=listArray; lst.options.add(o); } [/js] тут у меня originalRequest.responseText - возвращаемый аджаксом текст, по сути - строка пар значений, разделенных запятыми. Первое значение - "value" второе- "текст, выводимый в списке"