Динамически обновлять опции выбора элементов в JavaScript и PHP

Динамически обновлять опции выбора элементов в JavaScript и PHP

Вот идеальный ответ на ваш вопрос: W3Schools AJAX PHP Database

И если вы интегрируете этот пример в свой код, он должен выглядеть следующим образом:

HTML

 {amp}lt;select id="first-choice" onchange="leaveChange(this.value)"{amp}gt; {amp}lt;option selected value=""{amp}gt;Please Select{amp}lt;/option{amp}gt; {amp}lt;option value="CSE"{amp}gt;CSE{amp}lt;/option{amp}gt; {amp}lt;option value="ECE"{amp}gt;ECE{amp}lt;/option{amp}gt; {amp}lt;option value="EEE"{amp}gt;EEE{amp}lt;/option{amp}gt; {amp}lt;option value="MECH"{amp}gt;MECH{amp}lt;/option{amp}gt; {amp}lt;/select{amp}gt; {amp}lt;br{amp}gt; {amp}lt;select id="second-choice"{amp}gt; {amp}lt;option{amp}gt;Please choose from above{amp}lt;/option{amp}gt; {amp}lt;/select{amp}gt; 

JS

 function leaveChange(branch){ if (branch == "") { document.getElementById("second-choice").innerHTML = "{amp}lt;option{amp}gt;Please choose from above{amp}lt;/option{amp}gt;"; return; } else { if (window.XMLHttpRequest) { // code for IE7 , Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 {amp}amp;{amp}amp; xmlhttp.status == 200) { document.getElementById("second-choice").innerHTML = xmlhttp.responseText; } }; xmlhttp.open("GET","test.php?branch=" branch,true); xmlhttp.send(); } } 

Вам следует заменить имя файла test.php именем в этой строке: xmlhttp.open("GET","test.php?branch=" branch,true);

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector