Bloquear caja de texto en HTML

Bienvenidos a VerTutoriales.com en esta ocasión vamos a resolver la duda de un compañero de esta comunidad de formación. ¿Cómo bloquear una caja de texto en HTML? En este caso tenemos dos opciones dependiendo de la necesidad, veamos.

La primera es bloquear la caja y ponerla en modo solo lectura

<input type=”text” readonly=”readonly” />

De esta forma se bloquearía la caja de manera que no pudiera escribirse en ella, ni modificarse ni nada, simplemente mostraría la información de forma estandar.

La siguiente es poniendo como deshabilitada la caja

<input type=”text” disabled=”disabled” />

La única pega es que saldrá en grisacea.

Ya elegís cual es la manera que más se adapta a vuestra necesidad para bloquear la caja de texto.

Un saludo!

 

Te puede interesar:

10 comentarios

  • À commented on 14 octubre, 2012 Reply

    Vaya ! que me ha servido de mucho ^^
    muchas gracias =D
    me voy a dar una paseada por la pagina que esta muy buena

    • VideoTutoriales commented on 16 octubre, 2012 Reply

      Nada, si tienes cualquier duda sobre HTML, ya sabes que puedes comentarla para que te ayudemos a solucionarla.

  • Miguel Angel commented on 17 abril, 2013 Reply

    Como puedo hacer que un usuario al loguearse solo pueda ver los datos suyos, es decir tengo una base de datos con dos tablas una para el registro de usuario y otra donde pongo varios datos segun su municipio y enseñanza, yo quiero que cuando el usuario se loguee si es de digamos Matanzas, solo pueda ver y modificar los datos de Matanzas

    • VideoTutoriales commented on 18 abril, 2013 Reply

      Buenos Miguel Angel

      Pues tendrás que relacionar la tabla de usuarios, en este caso con “Municipio” o “Enseñanza” y en la tabla de información. Es decir, supongamos que tenemos la tabla “Usuarios” que tiene entre otros datos el campo población, además, tenemos otra tabla que se llama “Cursos” y tiene también el campo “Población” de esta manera podrás relacionar ambas tablas y hacer la consulta de la siguiente manera:

      Al logarse el usuario, sabemos que pertenece a una población en concreto. Solo tendremos que realizar una consulta tomando como dato la población del usuario:

      ‘Select * From Cursos WHERE poblacion = “‘.$poblacion_usuario.'”‘;

      Donde $poblacion_usuario es la variable donde hemos guardado la población en una consulta anterior cuando el usuario se había logado.

      Espero que me haya explicado para que puedas usarlo.
      Un saludo!

  • nosferomon commented on 26 junio, 2017 Reply

    excelnte ayuda, apesar del año sigue funcionando, gracias =D

    • Carlos Dk commented on 13 julio, 2017 Reply

      Hay cosas que no cambian :p

  • dayana commented on 25 julio, 2017 Reply

    muy bueno pero necesito enviar valores de un input desabilitado como lo hago disabled no me permite

    • Carlos Dk commented on 1 agosto, 2017 Reply

      no tiene que ver que esté disabled o enabled, la información que tenga la caja sigue siendo la misma 🙂

  • Peter commented on 7 diciembre, 2017 Reply

    Hola amigos de lo desconocido, tengo una duda que me esta matando. Tengo un fornulario con algunos campos incluidos select e input text y lo que quiero hacer es que cuando se seleccione un item del select se deshabiliten o habiliten algunos input text. Esto lo consegui con el disabled, pero el problema esta cuando envio la informacion del fotmulario, los inputs que deshabilito no se envian por supuesto, pero como hago para validar el hecho de no enviar informacion de algunos campos? Porque dependiendo de la opcion que seleccionó en el select, unas veces debera enviar su informacion y otras veces no.
    Probe con el read only pero al aplicarlo, no puedo manipularlo como el disabled para permitir o no permitir que escriban.
    POR FAVOR, cualquier sugerencia sera agradecida

    • Carlos Dk commented on 20 diciembre, 2017 Reply

      Hola!

      Se me ocurren varias opciones, que los campos los elimines y los crees al vuelo según la selección del Select, luego simplemente envías los que estén en pantalla.
      Otra opción es ocultar y mostrarlos, así puedes enviarlos todos.
      Otra más, usando javascript o por facilitarte más, JQuery, es que selecciones directamente los cambios que quieras enviar.

      En cualquiera de estos puedes tener la solución, siento no poder entenderte exactamente lo que nos indicas. Supongo que si pones un ejemplo concreto sería más sencillo. De todas maneras, lo más sencillo para manipular el DOM del html es usar javascript o JQuery como librería 😉

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *