validacion - validar formulario javascript html5

Las entradas de formulario deshabilitadas no aparecen en la solicitud

Question

Tengo algunas entradas deshabilitadas en un formulario y deseo enviarlas a un servidor, pero Chrome las excluye de la solicitud.

¿Hay alguna solución para esto sin agregar un campo oculto?

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />

    <!-- this does not appear in request -->
    <input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

</form>

Answer 1

Estoy actualizando esta respuesta ya que es muy útil. Sólo agregue readonly a la entrada.

Así que la forma será:

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />
    <input type="textbox" name="Percentage" value="100" readonly/>
</form>

Answer 2

Los elementos con atributo Deshabilitado no se envían o puede decir que sus valores no se publican (consulte el segundo punto en el Paso 3 en la especificación para crear el conjunto de datos del formulario ).

Es decir,

<input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

Para tu información,

1. Los controles desactivados no reciben el foco.
2. Los controles deshabilitados se omiten en la navegación de tabulación.
3. Los controles deshabilitados no se pueden publicar correctamente.

Puede usar el atributo de readonly en su caso, al hacer esto podrá publicar los datos de su campo.

Es decir,

<input type="textbox" name="Percentage" value="100" readonly="readonly" />

Para tu información,

1. Los elementos de solo lectura reciben el foco pero no pueden ser modificados por el usuario.
2. Los elementos de solo lectura están incluidos en la navegación de tabulación.
3. Los elementos de solo lectura se publican correctamente.

Answer 3

Me parece que esto funciona más fácil. lea solo el campo de entrada, luego escríbalo para que el usuario final sepa que es de solo lectura. Las entradas colocadas aquí (de AJAX, por ejemplo) todavía pueden enviarse, sin código adicional.

<input readonly style="color: Grey; opacity: 1; ">

Answer 4

Para publicar valores de las entradas deshabilitadas además de las entradas habilitadas, puede volver a habilitar todas las entradas del formulario a medida que se envía.

<form onsubmit="this.querySelectorAll(''input'').forEach(i => i.disabled = false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Si prefieres jQuery:

<form onsubmit="$(this).find(''input'').prop(''disabled'', false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Para ASP.NET MVC C # Razor, agregue el controlador de envío de esta manera:

using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post,
    // Re-enable all input elements on submit so they are all posted, even if currently disabled.
    new { onsubmit = "this.querySelectorAll(''input'').forEach(i => i.disabled = false)" } ))
{
    <!-- form content with input elements -->
}

Answer 5

Puede evitar totalmente la desactivación, es doloroso ya que el formato html no enviará nada relacionado con <p> o alguna otra etiqueta.

Así que en su lugar puedes poner regular

<input text tag just before you have `/>

agrega esto readonly="readonly"

No deshabilitaría su texto pero no cambiaría por usuario, por lo que funciona como <p> y enviará valor a través del formulario. Simplemente elimine el borde si desea hacerlo más parecido a la etiqueta <p>

Answer 6

Semánticamente esto se siente como el comportamiento correcto.

Me preguntaría " ¿Por qué debo enviar este valor? "

Si tiene una entrada deshabilitada en un formulario, entonces presumiblemente no desea que el usuario cambie el valor directamente

Cualquier valor que se muestre en una entrada deshabilitada debe ser

1. salida de un valor en el servidor que produjo el formulario, o
2. Si el formulario es dinámico, se puede calcular a partir de las otras entradas del formulario.

Suponiendo que el servidor que procesa el formulario es el mismo que el servidor que lo sirve, toda la información para reproducir los valores de las entradas deshabilitadas debe estar disponible en el procesamiento

De hecho, para preservar la integridad de los datos, incluso si el valor de la entrada deshabilitada se envió al servidor de procesamiento, realmente debería validarlo. ¡Esta validación requeriría el mismo nivel de información que necesitaría para reproducir los valores de todos modos!

Casi diría que las entradas de solo lectura tampoco deberían enviarse en la solicitud

Me alegro de ser corregido, pero todos los casos de uso que se me ocurren cuando se deben enviar entradas de solo lectura / deshabilitadas son en realidad solo problemas de estilo disfrazados

Answer 7

Si absolutamente tiene que tener el campo deshabilitado y pasar los datos, puede usar un javascript para ingresar los mismos datos en un campo oculto (o simplemente configurar el campo oculto también). Esto le permitiría tenerlo deshabilitado pero aún así publicar los datos a pesar de que estaría publicando en otra página.

Answer 8

Usando Jquery y enviando los datos con ajax, puede resolver su problema:

<script>

$(''#form_id'').submit(function() {
    $("#input_disabled_id").prop(''disabled'', false);

    //Rest of code
    })
</script>