Есть 2 селекта PHP: <td><select name=k1 ><option>'.$_GET["name"].'</option> '; $result2=mysql_query('SELECT name FROM klient ORDER BY name',$link) or die(mysql_errno($link).mysql_error($link)); while($data2=mysql_fetch_array($result2)) {echo '<option>'.$data2[name].'</option> '; } echo '</select></td> <td><select name=k2 > '; $result3=mysql_query('SELECT name FROM firm WHERE kli1 = "'.$name.'" or kli2 = "'.$name.'" OR kli3 = "'.$name.'" or kli4 = "'.$name.'" ORDER BY name',$link) or die(mysql_errno($link).mysql_error($link)); while($data3=mysql_fetch_array($result3)) {echo '<option>'.$data3[name].'</option> '; } echo '</select></td> Какую функцию OnСhange первого селекта написать, чтобы $name запроса второго селекта было значением первого селекта ? По форуму искал. Везде описаны методы с использованием style=display:none А мне нужно перерисовывать селект яваскриптом чтоли ? А не просто показывать его. Помогите пожалуйста. Желательно примером.
http://www.php.ru/forum/viewtopic.php?t=9420&start=0 ajax могу привести пример, у меня сделано, выбор страны, после выбора динамический составляется следующий селект с выбором региона
Видел, но динамики здесь мало [js] { '01': { 'n':'Нет', // Значение:надпись в селекте 'y':'Да' }, 'no_action': { 'no_action':'----------' }, '02': { '02.1':'02.1', '02.2':'02.2', '02.3':'02.3' }, '03': { '10':'10', '90':'90', '100':'100' }[/js] Как вместо этого заполнять значениями из mysql ?
аяксом посылаете значение php скрипту, он делает выборку и генерирует новый селект, который вы вставляете в нужный блок
Не работает у меня этот пример. Ничего не происходит когда выбираю страну. Работает это : index.php HTML: <html> <head> <title>Динамические селекты</title> <script type="text/javascript" language="javascript" > var d = document; var div_select; var req = Create(); function Country() { div_select = "reg"; d.getElementById('city').innerHTML = ''; var a = d.getElementById('country_id').value; query = "country_id="+a; Request(query); } function Create(){ if(navigator.appName == "Microsoft Internet Explorer"){ req = new ActiveXObject("Microsoft.XMLHTTP"); }else{ req = new XMLHttpRequest(); } return req; } function Request(query) { req.open('post', 'selects.php' , true ); req.onreadystatechange = Refresh; req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8"); req.send(query); } function Refresh() { var a,b; a = req.readyState; if( a == 4 ) { b = req.responseText; d.getElementById(div_select).innerHTML = b; } } </script> </head> <body> <?php include ("connect.php"); mysql_connect( MYSQL_SERVER, MYSQL_USER, MYSQL_PASSWORD ); @mysql_select_db( MYSQL_DATABASE ); @mysql_query('SET NAMES utf8'); @mysql_query('SET CHARACTER SET utf8'); @mysql_query('SET COLLATION_CONNECTION="utf8_general_ci"'); function country() { $country_id = isset($_POST['country_id'])?$_POST['country_id']:NULL; $query = "SELECT * FROM main"; $res = mysql_query($query); $select = "<select id=\"country_id\" name=\"country_id\" onchange=\"Country()\" >"; while($row = mysql_fetch_array($res)) { $select .= "<option value='".$row['kto']."'>".$row['kto']."</option>\r\n";} $select .= "</select>"; return $select; } echo country(); ?> <div id="reg" ></div> <div id="city" ></div> </body> </html> selects.php PHP: <?php include ("connect.php"); function region() { $query = 'SELECT name FROM firm WHERE kli1 = "'.$_POST['country_id'].'" or kli2 = "'.$_POST['country_id'].'" OR kli3 = "'.$_POST['country_id'].'" or kli4 = "'.$_POST['country_id'].'" ORDER BY name'; $res = mysql_query($query); $select = "<select id=\"region_id\" name=\"region_id\" >"; while($row = mysql_fetch_array($res)) { $select .= "<option value='".$row['region_id']."'>".$row['name']."</option>\r\n"; } $select .= "</select>"; return $select; } //if(isset($_POST['country_id'])) echo region(); ?> Только вот как это объединить в один документ ? Как передавать значение первого селекта в php и перерисовывать второй селект ?
regions.php PHP: <?php if(isset($_POST['city'])){ $city=$_POST['city']; setcookie('region',$city); header("Location:index.php"); } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//RU" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf8" /> <script language="JavaScript"> http = false; try { http = new XMLHttpRequest(); } catch (trymicrosoft) { try { http = new ActiveXObject("Msxml2.XMLHTTP"); } catch (othermicrosoft) { try { http = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { http = false; } } } if (!http) alert("Error initializing XMLHttpRequest!"); function GetCountry(){ document.getElementById("selectbutton").style.display="none"; document.getElementById("select2").innerHTML=''; document.getElementById("select3").innerHTML=''; country=document.getElementById("select1").value; url = "select.php?country="+country; http.open("GET", url, false); http.onreadystatechange = ChangeSelect; http.send(null); } function GetRegion(){ document.getElementById("select3").innerHTML=''; document.getElementById("selectbutton").style.display="none"; region=document.getElementById("selectedregion").value; url = "select.php?region="+region; http.open("GET", url, false); http.onreadystatechange = ChangeSelect2; http.send(null); } function ChangeSelect() { if ((http.readyState == 4) && (http.status == 200)){ document.getElementById("select2").innerHTML=http.responseText; } } function ChangeSelect2() { if ((http.readyState == 4) && (http.status == 200)){ document.getElementById("select3").innerHTML=http.responseText; } } function SelectCity(){ document.getElementById("selectbutton").style.display="block"; } </script> </head> <body> <div style="padding:20px;background-color:#F5F5F5;border:1px solid #FF8C00;position:absolute;top:20%;left:20%"> <center> <form method="POST" action="regions.php"> <table style="border:1px solid black;"> <tr> <td style="width:160px"> Выберите страну </td> <td style="width:160px"> Выберите регион </td> <td style="width:160px"> Выберите город </td> <td rowspan="2"> <input type="submit" value="Выбрать" style="display:none" id="selectbutton" /> </td> </tr> <tr> <td> <select id="select1" multiple onChange="GetCountry()"> <option value="3159">Россия</option> <option value="4">Австралия</option> <option value="63">Австрия</option> <option value="81">Азербайджан</option> <option value="173">Ангуилья</option> <option value="177">Аргентина</option> <option value="245">Армения</option> <option value="7716093">Арулько</option> <option value="248">Беларусь</option> <option value="401">Белиз</option> <option value="404">Бельгия</option> <option value="425">Бермуды</option> <option value="428">Болгария</option> <option value="467">Бразилия</option> <option value="616">Великобритания</option> <option value="924">Венгрия</option> <option value="971">Вьетнам</option> <option value="994">Гаити</option> <option value="1007">Гваделупа</option> <option value="1012">Германия</option> <option value="1206">Голландия</option> <option value="2567393">Гондурас</option> <option value="277557">Гонконг</option> <option value="1258">Греция</option> <option value="1280">Грузия</option> <option value="1366">Дания</option> <option value="2577958">Доминиканская республика</option> <option value="1380">Египет</option> <option value="1393">Израиль</option> <option value="1451">Индия</option> <option value="277559">Индонезия</option> <option value="277561">Иордания</option> <option value="3410238">Ирак</option> <option value="1663">Иран</option> <option value="1696">Ирландия</option> <option value="1707">Испания</option> <option value="1786">Италия</option> <option value="1894">Казахстан</option> <option value="2163">Камерун</option> <option value="2172">Канада</option> <option value="582029">Карибы</option> <option value="2297">Кипр</option> <option value="2303">Киргызстан</option> <option value="2374">Китай</option> <option value="582040">Корея</option> <option value="2430">Коста-Рика</option> <option value="582077">Куба</option> <option value="2443">Кувейт</option> <option value="2448">Латвия</option> <option value="2505884">Ливан</option> <option value="582060">Ливан</option> <option value="2509">Ливия</option> <option value="2514">Литва</option> <option value="2614">Люксембург</option> <option value="582041">Македония</option> <option value="277563">Малайзия</option> <option value="582043">Мальта</option> <option value="2617">Мексика</option> <option value="582082">Мозамбик</option> <option value="2788">Молдова</option> <option value="2833">Монако</option> <option value="2687701">Монголия</option> <option value="582065">Морокко</option> <option value="277551">Нидерланды</option> <option value="2837">Новая Зеландия</option> <option value="2880">Норвегия</option> <option value="582051">О.А.Э.</option> <option value="582105">Остров Мэн</option> <option value="582044">Пакистан</option> <option value="582046">Перу</option> <option value="2897">Польша</option> <option value="3141">Португалия</option> <option value="3156">Реюньон</option> <option value="277555">Румыния</option> <option value="5681">США</option> <option value="5647">Сальвадор</option> <option value="277565">Сингапур</option> <option value="582067">Сирия</option> <option value="5666">Словакия</option> <option value="5673">Словения</option> <option value="5678">Суринам</option> <option value="9575">Таджикистан</option> <option value="277567">Тайвань</option> <option value="582050">Тайланд</option> <option value="582090">Тунис</option> <option value="9638">Туркменистан</option> <option value="277569">Туркмения</option> <option value="9701">Туркс и Кейкос</option> <option value="9705">Турция</option> <option value="9782">Уганда</option> <option value="9787">Узбекистан</option> <option value="9908">Украина</option> <option value="10648">Финляндия</option> <option value="10668">Франция</option> <option value="277553">Хорватия</option> <option value="10874">Чехия</option> <option value="582031">Чили</option> <option value="10904">Швейцария</option> <option value="10933">Швеция</option> <option value="582064">Эквадор</option> <option value="10968">Эстония</option> <option value="3661568">ЮАР</option> <option value="11002">Югославия</option> <option value="11014">Южная Корея</option> <option value="582106">Ямайка</option> <option value="11060">Япония</option> </select> </td> <td> <center> <div id="select2"></div> </center> </td> <td> <center> <div id="select3"></div> </center> </td> </tr> </table> </form> </center> </div> </body> </html> select.php PHP: <?php $link = mysql_connect("localhost","root","") or die("Could not connect: " . mysql_error()); $db="reg"; mysql_select_db($db) or die("$db: ".mysql_error()); if(isset($_GET['country'])&&(is_numeric($_GET['country'])==true)){ $country=$_GET['country']; $query="SELECT * FROM `region` WHERE `country_id`='$country'"; $result=mysql_query($query,$link); echo '<select onChange="GetRegion()" multiple id="selectedregion">'; while($row=mysql_fetch_array($result)){ echo '<option value="'.$row['region_id'].'">'.$row['name'].'</option>'; } echo '</select>'; } if(isset($_GET['region'])&&(is_numeric($_GET['region'])==true)){ $region=$_GET['region']; $query="SELECT * FROM `city` WHERE `region_id`='$region'"; $result=mysql_query($query,$link); echo '<select multiple id="select3" onChange="SelectCity()" name="city">'; while($row=mysql_fetch_array($result)){ echo '<option value="'.$row['name'].'">'.$row['name'].'</option>'; } echo '</select>'; } ?> дамп базы reg http://narod.ru/disk/12236000/rocid.sql.zip
Padaboo, большое спасибо за код! Оч помог. Но не могу решить вопрос с отправкой введенных данных методом post. "Мучаю" Ваш код, подстраивая под себя. У меня 2 селекта, второй заполняется исходя из значений первого, затем введенные данные должны уйти почтой. index.php: Код (Text): ... <script language="JavaScript" src="script.js"></script> ... <form name="form1" method="post" action="send_mail.php"> <tr> <td>Селект1</td> <td> <select name="send1" id="select1" onChange="GetCountry()"> <option value="2">val1</option> <option value="3">val2</option> </select> </td> </tr> <tr> <td>Селект2:</td> <td> <div id="select2"></div> </td> </tr> script.js: Код (Text): http = false; try { http = new XMLHttpRequest(); } catch (trymicrosoft) { try { http = new ActiveXObject("Msxml2.XMLHTTP"); } catch (othermicrosoft) { try { http = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { http = false; } } } if (!http) alert("Error initializing XMLHttpRequest!"); function GetCountry(){ country=document.getElementById("select1").value; url = "select.php?country="+country; http.open("GET", url, false); http.onreadystatechange = ChangeSelect; http.send(null); } function ChangeSelect() { if ((http.readyState == 4) && (http.status == 200)){ document.getElementById("select2").innerHTML=http.responseText; } } select.php: Код (Text): <?php $link = mysql_connect("localhost","root") or die("Could not connect: " . mysql_error()); $db="t"; mysql_select_db($db) or die("$db: ".mysql_error()); if(isset($_GET['country'])&&(is_numeric($_GET['country'])==true)) { $country=$_GET['country']; $query="SELECT * FROM t WHERE id='$country'"; $result=mysql_query($query,$link); echo '<select name="send2">'; while($row=mysql_fetch_array($result)) { echo '<option value="'.$row['id'].'">'.$row['name'].'</option>'; } echo '</select>'; } ?> ну и, наконец, send_mail.php: Код (Text): <?php $msg=$_POST['select1'].$_POST['select2']; mail($to, $title, $msg, $from); ?> Send1 (значение первого селекта) отображается, а send2 (значение второго селекта) - нет Пробую в index.php ставить <div id="select2" name="send2"></div> - безрезультатно. Возможно, кто-нибудь подскажет, как послать постом данные в файл send_mail.php?
эждл начну пожалуй с того что этот код не работает в FF http://www.php.ru/forum/viewtopic.php?t=25336 где у вас не отображается значение второго селекта? интересно как отображается значение первого селекта если вы пытаетесь получить его по id? да , а разве можно POST в другой документ передавать? я думал он передается только внутри тела документа... я всегда в другой документ GET передаю ...
эждл у вас имена send1 и send2 если постом то как то так... PHP: ... <script language="JavaScript" src="script.js"></script> ... <form name="form1" method="post" action="index.php"> <tr> <td>Селект1</td> <td> <select name="send1" id="select1" onChange="GetCountry()"> <option value="2">val1</option> <option value="3">val2</option> </select> </td> </tr> <tr> <td>Селект2:</td> <td> <div id="select2"></div> </td> <?php if(isset($_POST['send1'])&&isset($_POST['send2'])){ echo 'Переданные данные '.$_POST['send1'].' '.$_POST['send2']; } ?> </tr>
эждл хех, вот тут Luge подсказывает что не в методе было дело, а в $_POST['send1'] $_POST['send2'] )))
в своем первом посте напутала - конечно, имена были _post[send1] и _post[send2]. Не работало! Помогла замена на гет...странно, конечно. В любом случае, спасибо Вам, Padaboo, за код и поддержку!
для тех кому важна работа под FF выложу на jquery regions.php PHP: <?php if(isset($_POST['city'])){ $city=$_POST['city']; setcookie('region',$city); header("Location:index.php"); } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//RU" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf8" /> <script language="JavaScript" src="jquery-1.4.2.js"></script> <script language="JavaScript"> function GetCountry(){ $("#regionselect").html(''); $("#cityselect").html(''); $("#selectbutton").hide(); var country=$("#select1").val(); var url = "select.php?country="+country; $.ajax({ url: url, type: "GET", success: function(e){ $("#regionselect").html(e); } }); } function GetRegion(){ $("#selectbutton").hide(); $("#cityselect").html(''); var region=$("#selectedregion").val(); var url = "select.php?region="+region; $.ajax({ url: url, type: "GET", success: function(e){ $("#cityselect").html(e); } }); } function SelectCity(){ $("#selectbutton").show(); } </script> </head> <body> <div style="padding:20px;background-color:#F5F5F5;border:1px solid #FF8C00;position:absolute;top:20%;left:20%"> <center> <form method="POST" action="regions.php"> <table style="border:1px solid black;"> <tr> <td style="width:160px"> Выберите страну </td> <td style="width:160px"> Выберите регион </td> <td style="width:160px"> Выберите город </td> <td rowspan="2"> <input type="submit" value="Выбрать" style="display:none" id="selectbutton" /> </td> </tr> <tr> <td> <select id="select1" multiple onChange="GetCountry()"> <option value="3159">Россия</option> <option value="4">Австралия</option> <option value="63">Австрия</option> <option value="81">Азербайджан</option> <option value="173">Ангуилья</option> <option value="177">Аргентина</option> <option value="245">Армения</option> <option value="7716093">Арулько</option> <option value="248">Беларусь</option> <option value="401">Белиз</option> <option value="404">Бельгия</option> <option value="425">Бермуды</option> <option value="428">Болгария</option> <option value="467">Бразилия</option> <option value="616">Великобритания</option> <option value="924">Венгрия</option> <option value="971">Вьетнам</option> <option value="994">Гаити</option> <option value="1007">Гваделупа</option> <option value="1012">Германия</option> <option value="1206">Голландия</option> <option value="2567393">Гондурас</option> <option value="277557">Гонконг</option> <option value="1258">Греция</option> <option value="1280">Грузия</option> <option value="1366">Дания</option> <option value="2577958">Доминиканская республика</option> <option value="1380">Египет</option> <option value="1393">Израиль</option> <option value="1451">Индия</option> <option value="277559">Индонезия</option> <option value="277561">Иордания</option> <option value="3410238">Ирак</option> <option value="1663">Иран</option> <option value="1696">Ирландия</option> <option value="1707">Испания</option> <option value="1786">Италия</option> <option value="1894">Казахстан</option> <option value="2163">Камерун</option> <option value="2172">Канада</option> <option value="582029">Карибы</option> <option value="2297">Кипр</option> <option value="2303">Киргызстан</option> <option value="2374">Китай</option> <option value="582040">Корея</option> <option value="2430">Коста-Рика</option> <option value="582077">Куба</option> <option value="2443">Кувейт</option> <option value="2448">Латвия</option> <option value="2505884">Ливан</option> <option value="582060">Ливан</option> <option value="2509">Ливия</option> <option value="2514">Литва</option> <option value="2614">Люксембург</option> <option value="582041">Македония</option> <option value="277563">Малайзия</option> <option value="582043">Мальта</option> <option value="2617">Мексика</option> <option value="582082">Мозамбик</option> <option value="2788">Молдова</option> <option value="2833">Монако</option> <option value="2687701">Монголия</option> <option value="582065">Морокко</option> <option value="277551">Нидерланды</option> <option value="2837">Новая Зеландия</option> <option value="2880">Норвегия</option> <option value="582051">О.А.Э.</option> <option value="582105">Остров Мэн</option> <option value="582044">Пакистан</option> <option value="582046">Перу</option> <option value="2897">Польша</option> <option value="3141">Португалия</option> <option value="3156">Реюньон</option> <option value="277555">Румыния</option> <option value="5681">США</option> <option value="5647">Сальвадор</option> <option value="277565">Сингапур</option> <option value="582067">Сирия</option> <option value="5666">Словакия</option> <option value="5673">Словения</option> <option value="5678">Суринам</option> <option value="9575">Таджикистан</option> <option value="277567">Тайвань</option> <option value="582050">Тайланд</option> <option value="582090">Тунис</option> <option value="9638">Туркменистан</option> <option value="277569">Туркмения</option> <option value="9701">Туркс и Кейкос</option> <option value="9705">Турция</option> <option value="9782">Уганда</option> <option value="9787">Узбекистан</option> <option value="9908">Украина</option> <option value="10648">Финляндия</option> <option value="10668">Франция</option> <option value="277553">Хорватия</option> <option value="10874">Чехия</option> <option value="582031">Чили</option> <option value="10904">Швейцария</option> <option value="10933">Швеция</option> <option value="582064">Эквадор</option> <option value="10968">Эстония</option> <option value="3661568">ЮАР</option> <option value="11002">Югославия</option> <option value="11014">Южная Корея</option> <option value="582106">Ямайка</option> <option value="11060">Япония</option> </select> </td> <td> <center> <div id="regionselect"></div> </center> </td> <td> <center> <div id="cityselect"></div> </center> </td> </tr> </table> </form> </center> </div> </body> </html> select.php PHP: <?php $link = mysql_connect("localhost","root","") or die("Could not connect: " . mysql_error()); $db="reg"; mysql_select_db($db) or die("$db: ".mysql_error()); if(isset($_GET['country'])){ $country=intval($_GET['country']); $query="SELECT * FROM `region` WHERE `country_id`='$country'"; $result=mysql_query($query,$link); echo '<select onChange="GetRegion()" multiple id="selectedregion">'; while($row=mysql_fetch_array($result)){ echo '<option value="'.$row['region_id'].'">'.$row['name'].'</option>'; } echo '</select>'; } if(isset($_GET['region'])){ $region=intval($_GET['region']); $query="SELECT * FROM `city` WHERE `region_id`='$region'"; $result=mysql_query($query,$link); echo '<select multiple id="select3" onChange="SelectCity()" name="city">'; while($row=mysql_fetch_array($result)){ echo '<option value="'.$row['name'].'">'.$row['name'].'</option>'; } echo '</select>'; } ?> дамп базы reg http://narod.ru/disk/12236000/rocid.sql.zip
Padaboo ужас. если $_GET['country'] и $_GET['region'] числа, то почему они эскейпятся, а не приводятся к инту? Кстати, mysql_escape_string уже depricated. И ещё, почему бы не отдать всё json'ом и на клиенте уже построить селект?
Luge поправил с приведением к инту, а что вместо mysql_escape_string, mysql_real_escape_string ? насчет json в голову не приходило, ни разу не пользовался, рисовать селект на клиенте это чтобы меньше нагружать сервер?
Печально видеть картину, когда при нажатии на кнопку тебе с помощью AJAX подгружается куева туча HTML кода с селектами, радиобоксами и прочей детской радостью. Я делал хомячок студии, там я решил сделать шаблонизатор на JavaScript. Почитав, понял - алгоритмы уже существуют, но как всегда начал изобретать велосипед, чтобы лучше всё понять и прочувствовать. Фронт состоял ис простейших div-слоёв с идентификаторами и плейсхолдерами (исключительно для красоты). По event-y jQuery ($(document).redy()) я запрашивал соответствующие блоки, которые приходили в формате JSON. После мы их парсили с использованием другой мета-информации и подставляли. Шаблонизатор был написал тоже с помощью jQuery. Сейчас, к июлю, нашу студию хочу проапдейтить. Использование объектной нотации и XML на базе ZF. P.S. Мой мост чет напомнил мне: Ло! Джей Ло!