Создание формы-списка с элементами из БД - PHP

maryan.vetrov · 23.12.2010, 16:34

Доброго времени суток! Не знаю на сколько понятно оформил заголовок, ну уж как есть, если что, прошу прощения.
Задача у меня возникла следующая. Создается простая форма, состоящая из нескольких выпадающих списков, выбирая пункты в которых, пользователь формирует запрос к базе данных. Мне нужно, чтобы вначале был активен только первый список, а после того, как в нем будет сделан выбор, становилось возможным развернуть второй, причем информация в него должна браться из базы данных, для атрибута который выбран в первом списке. Что было понятно, первый список - это список марок автомобилей, а второй - это список моделей, так вот выбрав марку, во втором списке должны появиться все модели для этой марки. Информация марка-модель, храниться в БД на сервере. Как обратиться к базе с запросом и получить необходимый список моделей на PHP, я знаю, но только в случае если пользователь например выбирает марку и нажимает кнопку отправить. А вот как организовать, чтобы работало так, как я описал выше, не очень представляю! Буду рад любой помощи!!!

Andkorol · 23.12.2010, 16:58

AJAX вам в помощь.

Посмотрите примеры 2 и 3 в этой статье.

maryan.vetrov · 23.12.2010, 17:37

Цитата:

Сообщение от Andkorol

AJAX вам в помощь.

Посмотрите примеры 2 и 3 в этой статье.

Спасибо! Буду изучать в этом направлении.
Если у кого есть еще какие-то идеи, пишите!

nec117 · 23.12.2010, 18:44

jQuery отлично облегчит вам работу, правда по сути это и есть ajax с js.. В общем разберетесь, там не так сложно, как покажется сначала

maryan.vetrov · 23.12.2010, 23:04

Воспользовавшись советом, я сделал пробную форму из двух списков. В первом выбираешь марку авто, а второй автоматически предоставляет список моделей для этой марки. И все вроде работает, выбираю марку, щелкаю по второму списку, он разворачивается нормально, т.е. модели из базы данных выбраны правильно, только я в нем ничего не могу выбрать. Подскажите в чем ошибка? Код html файла и php скрипта прилагаю.

Код HTML:

<html>
<head>
<title>Поиск в каталоге запчастей!</title>
<script type="text/javascript" src="jquery.js"></script>
</head>

<body>
<h1>Поиск запчасти в каталоге.</h1>

<form action="results.php" method="post">

<select id="marque" name="marque">
 <option value="choisi">-- Choisissez une marque --
 <option value="peugeot">-- Peugeot --
 <option value="renault">-- Renault --
 <option value="citroen">-- Citroen --
</select>
<br>
<select id="modele" name="modele">
 <option value="choisi">-- Choisissez un modele --
</select>
 <script>  
         $(document).ready(function(){  
           
             $("#marque").change(function(){ 
 $.ajax({  
                     type: "POST",  
                     url: "modele.php",  
                     data: "marque="+$("#marque").val(),
                     success: function(html){  
                         $("#modele").html(html);  
                     }  
                 });  
                 return false;  
             });  
               
         });  
     </script>
</form>	 
</body>
</html>

PHP код:


			
<html>

<body>

<?php

$marque=$_REQUEST['marque'];

$db=mysql_pconnect("localhost", "ххх", "ххх");

if(!$db)

{

echo "Error: Could not connect to database. Please try again later.";

exit;

}

mysql_select_db("ххххххххх");

$query ="select modele from modele where auto ='$marque'";

$result=mysql_query($query);

$num_results=mysql_num_rows($result);



for ($i=0; $i<$num_results; $i++)

{

$row=mysql_fetch_array($result);

echo "<option value='$row[modele]'>--$row[modele]--<br>";

}

 mysql_free_result($result);

?>



</body>

</html>

Заранее благодарен!

Cronos20 · 23.12.2010, 23:49

А нельзя было в success посмотреть что возвращает php скрипт например alert(html)?
Подсказываю ... в <select> он пытается вставить следующую структуру
<html>
<body>

<option>
</option>

</body>
</html>

+ ко всему прочему неправильно сделано
data: "marque="+$("#marque").val(),
замените на
data: $("#marque").val(),

И на будущее я бы посоветовал сразу разобраться с кодировками в аяксе ... а то потом обязательно появится ну ооочень много вопросов)

maryan.vetrov · 23.12.2010, 23:59

Цитата:

Сообщение от Cronos20

А нельзя было в success посмотреть что возвращает php скрипт например alert(html)?
Подсказываю ... в <select> он пытается вставить следующую структуру
<html>
<body>

<option>
</option>

</body>
</html>

+ ко всему прочему неправильно сделано
data: "marque="+$("#marque").val(),
замените на
data: $("#marque").val(),

И на будущее я бы посоветовал сразу разобраться с кодировками в аяксе ... а то потом обязательно появится ну ооочень много вопросов)

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

maryan.vetrov · 24.12.2010, 00:15

Цитата:

Сообщение от Cronos20

+ ко всему прочему неправильно сделано
data: "marque="+$("#marque").val(),
замените на
data: $("#marque").val(),

По этому поводу хочу сказать, что если исправить, так как вы говорите, перестает работать, ругается скрипт, что в 3 строке, он не знает кто-такой marque. Поясните, если можете. Мой вариант, мне самому не нравится, но он работает.

Cronos20 · 24.12.2010, 02:02

вот описание

Цитата:

data: Описание опции: опция содержит данные, отсылаемые на сервер. Данные конвертируются в строку, отсылаемую в качестве запроса. Строка прикрепляется к URL, если Вы используете GET запрос. Для того чтобы предотвратить автоматическую конвертацию данных в строку используйте опцию processData. В данной опции объект должен содержать парные ключ/значение. Если значение является массивом, jQuery объединит данные, например массив {foo:["bar1", "bar2"]} будет выглядеть следующим образом: "foo=bar1foo=bar2". Возвращаемый тип: объект, строка.

Ваш пример и будет работать, просто есть небольшое несоответствие (скажем так придираясь )))) )
У вас указан явно метод передачи POST, а ваша строка расчитана на GET, а обрабатываете вы универсальным массивом REQUEST - поэтому все работает.
Более корректно (и красиво) передавать объект, там я кстати немного не то написал

data: {marque: $("#marque").val(),}

Как-то так. При больших объемах данных этот способ лучше, универсальнее и большесоответсnвует стилю самого jquery.

maryan.vetrov · 24.12.2010, 02:58

Цитата:

Сообщение от Cronos20

вот описание

Спасибо, понял!
Еще такой вопрос, если мне нужно добавить третий список, данные в котором должны формироваться из ходя из того, что выбрано во втором списке(генерируемом скриптом), я пишу новый php скрипт, а в основной документ добавляю еще один jquery+ajax скрипт, точно такой же, за исключением id списка и имени php скрипта? Я так пробовал, не работает.

23.12.2010, 16:34	#1
maryan.vetrov Пользователь Регистрация: 07.06.2010 Сообщений: 75	Создание формы-списка с элементами из БД Доброго времени суток! Не знаю на сколько понятно оформил заголовок, ну уж как есть, если что, прошу прощения. Задача у меня возникла следующая. Создается простая форма, состоящая из нескольких выпадающих списков, выбирая пункты в которых, пользователь формирует запрос к базе данных. Мне нужно, чтобы вначале был активен только первый список, а после того, как в нем будет сделан выбор, становилось возможным развернуть второй, причем информация в него должна браться из базы данных, для атрибута который выбран в первом списке. Что было понятно, первый список - это список марок автомобилей, а второй - это список моделей, так вот выбрав марку, во втором списке должны появиться все модели для этой марки. Информация марка-модель, храниться в БД на сервере. Как обратиться к базе с запросом и получить необходимый список моделей на PHP, я знаю, но только в случае если пользователь например выбирает марку и нажимает кнопку отправить. А вот как организовать, чтобы работало так, как я описал выше, не очень представляю! Буду рад любой помощи!!!

23.12.2010, 23:04	#5
maryan.vetrov Пользователь Регистрация: 07.06.2010 Сообщений: 75	Воспользовавшись советом, я сделал пробную форму из двух списков. В первом выбираешь марку авто, а второй автоматически предоставляет список моделей для этой марки. И все вроде работает, выбираю марку, щелкаю по второму списку, он разворачивается нормально, т.е. модели из базы данных выбраны правильно, только я в нем ничего не могу выбрать. Подскажите в чем ошибка? Код html файла и php скрипта прилагаю. Код HTML: <html> <head> <title>Поиск в каталоге запчастей!</title> <script type="text/javascript" src="jquery.js"></script> </head> <body> <h1>Поиск запчасти в каталоге.</h1> <form action="results.php" method="post"> <select id="marque" name="marque"> <option value="choisi">-- Choisissez une marque -- <option value="peugeot">-- Peugeot -- <option value="renault">-- Renault -- <option value="citroen">-- Citroen -- </select> <br> <select id="modele" name="modele"> <option value="choisi">-- Choisissez un modele -- </select> <script> $(document).ready(function(){ $("#marque").change(function(){ $.ajax({ type: "POST", url: "modele.php", data: "marque="+$("#marque").val(), success: function(html){ $("#modele").html(html); } }); return false; }); }); </script> </form> </body> </html> PHP код: <html> <body> <?php $marque=$_REQUEST['marque']; $db=mysql_pconnect("localhost", "ххх", "ххх"); if(!$db) { echo "Error: Could not connect to database. Please try again later."; exit; } mysql_select_db("ххххххххх"); $query ="select modele from modele where auto ='$marque'"; $result=mysql_query($query); $num_results=mysql_num_rows($result); for ($i=0; $i<$num_results; $i++) { $row=mysql_fetch_array($result); echo "<option value='$row[modele]'>--$row[modele]--<br>"; } mysql_free_result($result); ?> </body> </html> Заранее благодарен!

23.12.2010, 23:49	#6
Cronos20 Форумчанин Регистрация: 08.07.2010 Сообщений: 679	А нельзя было в success посмотреть что возвращает php скрипт например alert(html)? Подсказываю ... в <select> он пытается вставить следующую структуру <html> <body> <option> </option> </body> </html> + ко всему прочему неправильно сделано data: "marque="+$("#marque").val(), замените на data: $("#marque").val(), И на будущее я бы посоветовал сразу разобраться с кодировками в аяксе ... а то потом обязательно появится ну ооочень много вопросов) Последний раз редактировалось Cronos20; 23.12.2010 в 23:53.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Управление элементами списка по сети	alekseiryzhakov	Работа с сетью в Delphi	0	22.12.2010 16:17
Операция над элементами со списка	b1otekk	Microsoft Office Excel	1	02.06.2010 01:59
VBA for Excel "Операция над элементами со списка"	b1otekk	Помощь студентам	0	26.05.2010 23:13
Как из формы открыть отчет выбрав его из списка?	NadinLip	Microsoft Office Access	5	18.06.2009 08:26
создание списка	zetrix	Microsoft Office Excel	0	31.10.2006 08:05

23.12.2010, 16:58	#2
Andkorol Старожил Регистрация: 31.05.2010 Сообщений: 3,301	AJAX вам в помощь. Посмотрите примеры 2 и 3 в этой статье.

23.12.2010, 18:44	#4
nec117 Форумчанин Регистрация: 01.10.2008 Сообщений: 266	jQuery отлично облегчит вам работу, правда по сути это и есть ajax с js.. В общем разберетесь, там не так сложно, как покажется сначала