Vamos a continuar con nuestro proyecto y vamos a abrir ahora lo que viene siendo el diseño puede ser
que aquí se vende o compras en algunos casos queremos darle opciones al usuario para que puedan seleccionar
es muy común en muchos sitios ver si lo tienen por ejemplo en los de ventas puedes seleccionar una categoría
por ejemplo si eliges una casa te preguntan en venta o renta.
Si buscas un automóvil te dice qué tipo de automóvil buscas entre muchas cosas ese tipo de campos se
conoce como Selleck que un level Lebón y vas con opciones opciones y vamos a poner vende o compra y
podemos ponerlo aquí por ejemplo Salek este lo vamos a quitar y ya vimos que es para leerlo en un lenguaje
de Bakken su idea iba a ser opciones y por ejemplo aquí podemos darle enter y cada una de las opciones
se conoce como option.
Puedes ver que este es un poco más complejo que los otros esto es nada más era una etiqueta que tiene
etiqueta apertura cierre y cada opción va a tener que irse agregada por separado.
Aquí vamos a poner comprá y lo que vamos a poner Hobson y ponemos vende ahorita vemos que son estos
valiosos si guardas cambios si recargas puedes ver que das click te permite seleccionar una opción o
la otra en algunos casos algunas personas te gusta por ejemplo quieres agregar un texto que diga seleccione
usualmente lo vas a hacer con otra opción que va a decir por ejemplo aquí son elecciones y un guión
entonces eso puede ser que viene con una opción puedes dar click aquí y te permite seleccionar compra
o vende.
El detalle es que por ejemplo alguien puede presionar seleccione y eso es inválido.
Por lo tanto podemos agregarle un atributo a esta opción y decirle bueno esta opción va a estar deshabilitada
y le pones un diseño.
Por ejemplo recargas puedes ver que se deshabilita y no me permite seleccionarla.
Entonces puedes definir una selección de una opción como seleccionada por default y eso va a permitir
que aparezca seleccione pero de clic y no lo puedo seleccionar tengo que elegir una de estas dos pero
no puedo volver a seleccione.
Entonces por ejemplo muchos sitios de venta de clasificados por ejemplo ponen aquí marca y puedes seleccionar
la marca de un automóvil por ejemplo y este es el Legg.
Va a ser por ejemplo puedo cortar esta opción y ponerlo abajo y no importa que sea la última opción
como por default viene seleccionada se coloca así si no tuviéramos esa opción seleccionada va a seleccionar
por default la primera que se presente pero se lee que es una forma en la que puedes forzar para que
una opción venga seleccionada por default.
No es que arriba ahora qué son estos valores de aquí.
Bueno la idea es que por ejemplo cuando alguien busque por ejemplo un automóvil en venta o por ejemplo
en este caso compró vende estos valio son los que se van a enviar por ejemplo exitoso su compra o vende
esto que está aquí adentro de las opciones es lo que el usuario puede ver pero lo que está aquí en el
barrio es lo que va a leer el lenguaje de programación de ahí va a saber qué acciones realizar por ejemplo
en un sitio web nuevamente de anuncios.
Si alguien por ejemplo selecciona una marca de automóviles selecciona esa marca le va a mostrar el listado
de los automóviles que pertenecen a esa marca.
Ese valio lo estaría leyendo el lenguaje de Bakken.
Por lo tanto gracias a ello va a saber qué tiene que hacer después ver que este es el Select un poco
más complejo y cada opción debe ir en su propia etiqueta después podemos ver que tenemos una opción
que dice a qué bajo presupuesto podemos agregar también levels para cantidades que un level y por ejemplo
le podemos poner aquí cantidad y poner aquí cantidad y L'Espresso input.
Anteriormente hemos sido utilizado Tex habíamos utilizado otras opciones como el mail.
En este caso para recibir números ponemos nombre y guardamos cambios abrimos el proyecto y recargamos
y éste solamente va a recibir números puedes ver que incluso si lo eliminas y tratas de escribir con
letras no te deja tienen que ser por los números.
Por ejemplo si lo abres en un teléfono móvil digamos quienen simuladores de vuelo por ejemplo el Selleck
puedes ver que está su interfaz esto es nativo del navegador esto tú no lo puedes cambiar pero por ejemplo
aquí una cantidad nos aparece el control como para poder escribir una cantidad.
El detalle es que este no valida por ejemplo tú puedes ponerle números letras y no valida.
Estos campos usualmente van a estar va a depender de cada navegador el soporte que tienen pero puedes
ver qué queda de esta forma entonces la interfaz o cómo se ve cada input va a depender también de la
plataforma y queda de esta forma.
Ahora por ejemplo tal vez alguien quiera ponerle menos uno menos cinco etcétera.
Puedes agregar algunos atributos por ejemplo mil es decir que mínimo cero los ponen aquí cero y en otra
permitiria hacia abajo.
El detalle es que de nueva cuenta no.
Por ejemplo si le pones menos 20 pasa correctamente entonces esta validación que está aquí solamente
funciona con estas flechas entonces es otra opción si lo pones por ejemplo aquí Max 10 también por ejemplo
voy a recargar no me puedo ir hacia menos de cero pero tampoco puedo irme hacia más de 10 si de nueva
cuenta esto solamente funciona en los controles que están ahí.
Si quieres que funcione por ejemplo escribiendo el dato en EU es también o en cualquier plataforma.
Usualmente eso se hace con JavaScript.
También tenemos Steck digamos 5 y eso es lo que hace ir de cinco en cinco es decir cinco diez cinco
cero o 10 y son como saltos.
Entonces yo por ejemplo con mis sobrinos les ayudo a hacer la tabla del 5 y por ejemplo usamos aquí
5 10 15 20 25 y podemos ir continuando.
Entonces ya tenemos listo otro grupo de campos puedes ver que de esta forma con las cantidades y toda
esta parte de aquí.
Si abrimos el diseño obviamente el diseño es diferente todavía no vemos la parte del CSS pero nos hacen
falta otros campos por ver tenemos lo que es el contacto así que veámoslo en el siguiente video.