Categorías: código HTML

input type="checkbox"

Índice

La etiqueta <input> de HTML tiene como valor "checkbox" en su atributo type, input type="checkbox", esto simboliza aún control de dos o más estados que permite a los usuarios finales seleccionar o deseleccionar de uno a mas opciones. Este campo puede ser de gran utilidad para recolectar informaciones cómo a los valores booleanos (verdad o falso), como también responder a las preguntas, ¿usted aceptar condiciones?, ¿usted rechazar las condiciones?.
A la hora de seleccionar un estado por la presencia del atributo booleano checked, cuando el formulario es enviado a la gente procesador, el envío de esta selección es su valor del atributo value, es decir del opción seleccionada a la hora de enviar el formulario al gente procesador es enviado su valor del atributo value.

indice del tema

Ejemplos

En este presente ejemplo mostramos una lista para dar respuesta a nuestra pregunta, usted podrá marcar de uno a más casillas, dependiendo de tu respuesta que tú tengas, para ello usaremos el atributo value, para ser enviado su valor la gente procesador.

<form style="background-color: #3f6a9e;">
<fieldset>

<legend><b>¿Que lenguajes de programacion conoce usted?</b></legend>
 <input type="checkbox" value="1"> Php<br>
 <input type="checkbox" value="2"> c#<br>
 <input type="checkbox" value="3"> JavaScript<br>
 <input type="checkbox" value="3"> C++<br>
 <input type="submit">
</fieldset>
 </form>


La mayoría de de las casillas una vez echa clic en el nombre debería de seleccionarse, este problema tuvimos en el ejemplo anterior para ello para la solución de este problema haremos el uso de la etiqueta <label>. De esta manera estaremos asociando la casilla de verificación como los demás que esté dentro de la etiqueta <label>.

<form style="background-color: #3f6a9e;">
      <fieldset>

          <legend><b>¿Que lenguajes de programacion conoce usted?</b></legend>
          <label><input type="checkbox" value="1"> Php </label><br>
          <label><input type="checkbox" value="2"> c#</label><br>
          <label><input type="checkbox" value="3"> JavaScript</label><br>
          <label><input type="checkbox" value="3"> C++<br>
              <input type="submit"></label>
      </fieldset>
  </form>


Para este ejemplo haremos el uso del atributo checked, esto indicará a navegador a la hora de cargar que la casilla debe estar marcada.

<form style="background-color: #3f6a9e;">
    <fieldset>

        <legend><b>¿Que lenguajes de programación conoce usted?</b></legend>
        <label><input type="checkbox" value="1" checked> Php </label><br>
        <label><input type="checkbox" value="2" checked> c#</label><br>
        <label><input type="checkbox" value="3"> JavaScript</label><br>
        <label><input type="checkbox" value="3"> C++<br>
            <input type="submit"></label>
    </fieldset>
</form>


Por último tenemos un ejemplo de input type="checkbox", haremos uso del atributo required. Cuando una vez aplicamos este atributo booleano, el navegador no permitirá el envío de formulario hasta que esta casilla sea seleccionada, esto podría ser útil para requerimientos de conformidad.

<form style="background-color: #3f6a9e;">
       <fieldset>

           <legend><b>¿aceptas nuestras condiciones de servicio?</b></legend>
           <label><input type="checkbox" value="1" required> Si aceptos </label><br>
           <input type="submit">
       </fieldset>
   </form>

admin

Compartir
Publicado por
admin

Entradas recientes

Descargar driver brother hl 4150cdn

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 4150cdn de…

1 semana hace

Descargar driver brother dcp j125

En el siguiente artículo les vamos a enseñar a descargar el driver brother dcp j125 de…

1 semana hace

Descargar driver brother hl 1210w

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 1210w de…

1 semana hace

Descargar driver brother mfc j480dw

En el siguiente artículo les vamos a enseñar a descargar el driver brother mfc j480dw de…

1 semana hace

Descargar driver brother dcp j4120dw

En el siguiente artículo les vamos a enseñar a descargar el driver brother dcp j4120dw de…

1 semana hace

Descargar driver brother hl 5340d

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 5340d de…

1 semana hace