Temas > Programacion > Html > Formulario select (agrupamiento de opciones) html
Julio

Formulario - select (agrupamiento de opciones)
Hemos visto que podemos crear cuadros de selección individual o de
selección múltiple. Ahora veamos que podemos agrupar las opciones que
tiene el cuadro de selección, esto tiene sentido si el cuadro de
selección tiene muchos items.
Se cuenta con un nuevo elemento llamado optgroup que agrupa un conjunto de
elementos option.
Veamos un ejemplo de agrupar una serie de opciones, agruparemos una serie
de frutas y verduras:
<?php // esto no va
<html>
<head>
<title>Prueba de formulario</title>
</head>
<body>
<form action="/registrardatos.php" method="post">
Seleccione una fruta o verdura:
<select name="articulo">
<optgroup label="Frutas">
<option value="1">Naranjas</option>
<option value="2">Manzanas</option>
<option value="3>Sandia</option>
<option value="4">Frutilla</option>
<option value="5">Durazno</option>
<option value="6">Ciruela</option>
</optgroup>
<optgroup label="Verduras">
<option value="7">Lechuga</option>
<option value="8">Acelga</option>
<option value="9">Zapallo</option>
<option value="10">Papas</option>
<option value="11">Batatas</option>
<option value="13">Zanahorias</option>
<option value="14">Rabanitos</option>
<option value="15">Calabaza</option>
</optgroup>
</select>
<br>
<input type="submit" value="Enviar">
</form>
</body>
</html>
?> // esto no va
Como podemos observar para agrupar una serie de opciones dentro de un
select debemos encerrarlas con el elemento optgroup:
<?php // esto no va
<optgroup label="Frutas"> <option value="1">Naranjas</option> <option
value="2">Manzanas</option> <option value="3>Sandia</option> <option
value="4">Frutilla</option> <option value="5">Durazno</option> <option
value="6">Ciruela</option> </optgroup>
?> // esto no va
La propiedad label del elemento optgroup aparece dentro del control select
pero no se puede seleccionar, es un título.
La propiedad label del elemento optgroup es el texto que se debe mostrar
dentro del select.
Se puede hacer agrupamiento de opciones y permitir selecciones
múltiples.













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google




LunMarMieJueVieSabDom
       
1234567
8910111213 14
15161718192021
22232425262728
2930     

Domingo 14 de Septiembre 2025
Semana 37

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal
Rechazar    Aceptar