ProfiPHPProfiPHP
Категория: Полезное в PHP

Зависимость между двумя списками Select

При написании проекта расписания движения автобусов городских маршрутов столкнулся с проблемой создания зависимости между двумя разными списками.

Данный проект состоял из отдельных таблиц маршрутов (route) и остановок (busstops), а также основной таблицы (hours), в которой сохранялось расписание движения.

Таблица маршрутов состояла из трех полей: Id, Name, Number. В поле Name сохранялось название маршрута, в поле Number — его номер.

Таблица остановок состояла из Id и Name. Соответственно в ней сохранялась информация о названии остановок.

В таблице расписания движения были поля Id, Route, Busstops и Time. Поля Route и Busstops выбирались из соответствующих им таблиц.

После добавления всей необходимой информации, была создана форма поиска, где были отдельные поля маршрутов, остановок и времени. Нужно было сделать так, чтобы при выборе конкретного маршрута, в списке остановок отображались только те остановки, которые присутствуют в данном маршруте. Для этого необходимо создать зависимость между двумя списками Select.

Опишу данный процесс:

1. Выбираем маршрут.

2. Ищем все остановки, которые присутствуют в данном маршруте.

3. Выводим остановки.

Данное задание очень красиво решить с помощью JavaScript и Jquery, благодаря которым можно выполнять операции без перезагрузки страницы.

Я не буду полностью расписывать весь код, а остановлюсь на наиболее важных моментах.

1. Вывод списков:
Маршрут
<select id="route" name="route">
<option value="">--</option>
<?php
$sql_result = $db->query( "SELECT * FROM `route` ORDER BY `id` DESC" );
while ( $row = $db->get_row( $sql_result ) ) {
echo '<option value="'.$row['id'].'">'.htmlspecialchars( $row['name'], ENT_QUOTES ).'</option>';
}
?>
</select>
Остановка
<select id="busstops" name="busstops">
<option value="">--</option>
<?php
$sql_result = $db->query( "SELECT * FROM `busstops` ORDER BY `id` DESC" );
while ( $row = $db->get_row( $sql_result ) ) {
echo '<option value="'.$row['id'].'">'.htmlspecialchars( $row['name'], ENT_QUOTES ).'</option>';
}
?>
</select>
Далее создаем JS:
$(document).ready( function(e)
{
$('select[name="route"]').change(function(){
route = $(this).val( );
$.ajax({
type: "POST",
url: "/ajax/select_route.php",
data: { "route": route },
success: function( data ) { $('select[name="busstops"]').empty( ).append( data ); }
});
});
});
Файл Select_route.php будет иметь такое основное содержание:
if ( isset( $_POST['route'] ) )
{
$route = trim( strval( $_POST['route'] ) );
$array_list = array( );
$option_list = array( );
$sql_result = $db->query( "SELECT DISTINCT `busstops` FROM `hours` WHERE ( `route` = {$route} )" );
while ( $row = $db->get_row( $sql_result ) ) {
$array_list[ ] = $row['busstops'];
}
$array_list = implode( ',', $array_list );
$sql_result = $db->query( "SELECT * FROM `busstops` WHERE id IN ({$array_list}) ORDER BY `id` DESC" );
while ( $row = $db->get_row( $sql_result ) ) {
$option_list .= '<option value="'.$row['id'].'">'.htmlspecialchars( $row['name'], ENT_QUOTES ).'</option>';
}
exit( $option_list);
}
В скрипте используется класс для работы с базой данных MySQL.

Данный вариант создаст зависимость между двумя списками Select. Основные плюсы данного подхода:

1. Динамичность (без перезагрузки страницы).

2. Безошибочность (пользователь будет вводить только релевантные данные).

3. Удобство и скорость работы.

Добавить комментарий

Имя:
Текст комментария: