Category: HTML

Readonly vs disabled

By , 04/11/2009 13:19

Muchas veces la solución a un problema está delante de tus narices pero no eres capaz de verlo, estas tan metido en tu código que no eres capaz de salirte y verlo objetivamente. Para mi esa es una de las mejores virtudes que puede tener un buen programador, ser capaz de desconectar y ver de nuevo el código desde otro punto de vista. Esto lleva años y años así que mi consejo suele ser… Dile al compañero que lo mire. Seguro que el, que está fuera es capaz de localizar tu fallo muchisimo mas rápido que tu.

Hoy se me ha dado una situación de “bloqueo” que he podido resolver por mi mismo y en relativo poco tiempo, el problema consistía en que al hacer submit en un formulario había ciertos valores que no se estaban pasando por POST. En este formulario para evitar que el usuario (tonto y manazas por naturaleza) habíamos colocado la propiedad “disabled” a algunos campos de texto, motivo por el cual tras muchos cabezazos descubrimos que la propiedad “disabled” hace que el input no sea tenido en cuenta por el formulario para pasar por POST.

Mi consejo.

Usad disabled solo exclusivamente cuando no se necesite ese valor al hacer submit, en cualquier otra situación se debe usar la propiedad “read-only” que aunque no permite la escritura si que permite pasar el value por POST en el formulario.

Aquí una descripción algo mas detallada obtenida del W3C:

17.12.1 Disabled controls

Attribute definitions

disabled
When set for a form control, this boolean attribute disables the control for user input.

When set, the disabled attribute has the following effects on an element:

  • Disabled controls do not receive focus.
  • Disabled controls are skipped in tabbing navigation.
  • Disabled controls cannot be successful.

The following elements support the disabled attribute: BUTTON, INPUT, OPTGROUP, OPTION, SELECT, and TEXTAREA.

This attribute is inherited but local declarations override the inherited value.

How disabled elements are rendered depends on the user agent. For example, some user agents “gray out” disabled menu items, button labels, etc.

In this example, the INPUT element is disabled. Therefore, it cannot receive user input nor will its value be submitted with the form.

<INPUT disabled name="fred" value="stone">

Note. The only way to modify dynamically the value of the disabled attribute is through a script.

17.12.2 Read-only controls

Attribute definitions

readonly
When set for a form control, this boolean attribute prohibits changes to the control.

The readonly attribute specifies whether the control may be modified by the user.

When set, the readonly attribute has the following effects on an element:

  • Read-only elements receive focus but cannot be modified by the user.
  • Read-only elements are included in tabbing navigation.
  • Read-only elements may be successful.

The following elements support the readonly attribute: INPUT and TEXTAREA.

How read-only elements are rendered depends on the user agent.

Note. The only way to modify dynamically the value of the readonly attribute is through a script.

Panorama Theme by Themocracy