Программирование HTML PHP: генерация и использование выпадающего списка Sat, December 21 2024  

Поделиться

Нашли опечатку?

Пожалуйста, сообщите об этом - просто выделите ошибочное слово или фразу и нажмите Shift Enter.


PHP: генерация и использование выпадающего списка Печать
Добавил(а) microsin   
< ?php
$CRLF = chr(0x0d).chr(0x0a);
echo '< SELECT id="select01" size="1">'.$CRLF;
echo ' < option value="1">___________________'.$CRLF;
echo ' < option value="2">A'.$CRLF;
echo ' < option value="3">B'.$CRLF;
echo '< /SELECT>'.$CRLF;
echo '< SELECT id="select02" size="4">'.$CRLF;
echo ' < option value="1">........'.$CRLF;
echo ' < option value="2">C'.$CRLF;
echo ' < option value="3">D'.$CRLF;
echo ' < option value="4">F'.$CRLF;
echo ' < option value="5">F1'.$CRLF;
echo ' < option value="6">F2'.$CRLF;
echo ' < option value="7">F3'.$CRLF;
echo ' < option value="8">F4'.$CRLF;
echo '< /SELECT>'.$CRLF;
echo '< SELECT id="select03" size="8">'.$CRLF;
echo ' < option value="1">........'.$CRLF;
echo ' < option value="2">C2'.$CRLF;
echo ' < option value="3">D2'.$CRLF;
echo ' < option value="4">F2'.$CRLF;
echo '< /SELECT>'.$CRLF;
echo '< SELECT id="select04" size="1">'.$CRLF;
echo ' < option value="1"> '.$CRLF;
echo ' < option value="2">G'.$CRLF;
echo ' < option value="3">H'.$CRLF;
echo '< /SELECT>'.$CRLF;
?>

После выполнения получите такую картинку:

< SELECT id="select01" size="1">
   < option value="1">___________________
   < option value="2">A
   < option value="3">B
< /SELECT>
< SELECT id="select02" size="4">
   < option value="1">........
   < option value="2">C
   < option value="3">D
   < option value="4">F
   < option value="5">F1
   < option value="6">F2
   < option value="7">F3
   < option value="8">F4
< /SELECT>
< SELECT id="select03" size="8">
   < option value="1">........
   < option value="2">C2
   < option value="3">D2
   < option value="4">F2
< /SELECT>
< SELECT id="select04" size="1">
   < option value="1">                                
   < option value="2">G
   < option value="3">H
< /SELECT>

 

Выводы:

1. От параметра size зависит высота списка и его стиль.
2. Ширина списка зависит от длины текста самого длинного элемента списка. Если применяется не моноширинный шрифт, то получается, что длина еще зависит от содержимого элемента (например, строка '___' длиннее, чем '...', хотя обе состоят из 3-х символов).
3. Строка из пробелов в качестве элемента списка тоже отображается, но количество пробелов не влияет на ширину списка.

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

[Пример 1 c использованием JavaScript]

Файл index.htm:

< html>< body>
< script language="JavaScript" type="text/javascript" src="tools.js">< /script>
< SELECT id="select01" size="1" onchange="seltag()">
   < option value="1">___________________
   < option value="2">A
   < option value="3">B
< /SELECT>
< /body>< /html>

Файл part1.htm:

Пользователь выбрал пункт 1

Файл part2.htm:

Пользователь выбрал пункт 2

Файл part3.htm:

Пользователь выбрал пункт 3

Файл tools.js:

function seltag() 
{
   var p;
   p=document.all["select01"].value;
   document.location = "part"+p+".htm";
}

Здесь при пользовательском выборе (onchange) срабатывает процедура seltag(), где берется значение value, из неё формируется имя открываемого html-файла (partN.htm) в соответствующий файл происходит переход.

[Пример 2 c использованием исключительно PHP]

Файл index.php:

< html>< body>
< SELECT ID="Forms Combo Box2" NAME="cbAcrSorting" 
       onchange="window.location='index.php?sorting='+this.value">
< ?php
$sort = ($_GET["sorting"] == 'no_sorting')?false:true;
echo '< option value="no_sorting" '.($sort?'':'SELECTED').'>нет сортировки< /option>'.$CRLF;
echo '< option value="sorting" '.(!$sort?'':'SELECTED').'>по порядку< /option>'.$CRLF;
?>
< /SELECT>
< /body>< /html>

Этот пример кажется совсем простым, однако это не так. Код выводит выпадающий список, который предназначен для выбора порядка сортировки - генерируются теги OPTION. При изменении пользователем содержимого выпадающего списка (onchange) вызывается тот же самый файл, и выбранное пользователем значение передается через переменную sorting. Это означает, что строку браузера будет попадать либо:

http://test1.ru/index.php?sorting=sorting

если пользователь выбрал "по порядку", или:

http://test1.ru/index.php?sorting=no_sorting

если пользователь выбрал "без сортировки".

Выборка значения переменной осуществляется оператором $_GET["sorting"]. Выбранное значение списка "запоминается" благодаря генерации параметра SELECTED в нужной строке выпадающего списка.

 

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


Защитный код
Обновить

Top of Page