¿Cómo evitar enviar campos de entrada que están ocultos por la pantalla: ninguno a un servidor?

Imagine que tiene un formulario en el que cambia la visibilidad de varios campos. Y si el campo no se muestra, no desea que se solicite su valor.

¿Cómo maneja esta situación?

Establecer un elemento de formulario en deshabilitado evitará que vaya al servidor, por ejemplo:

<input disabled="disabled" type="text" name="test"/>

En javascript significaría algo como esto:

var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
    if(inputs[i].style.display == 'none') {
        inputs[i].disabled = true;
    }
}
document.forms[0].submit();

En jQuery:

   $('form > input:hidden').attr("disabled",true);
   $('form').submit();

Puede usar javascript para establecer el atributo deshabilitado. El evento de clic del botón 'enviar' es probablemente el mejor lugar para hacer esto.

Sin embargo, desaconsejaría hacer esto en absoluto. Si es posible, debe filtrar su consulta en el servidor. Esto será más confiable.

Si desea deshabilitar todos los elementos o ciertos elementos dentro de un elemento principal oculto, puede usar

$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");

Este ejemplo http://jsfiddle.net/gKsTS/ deshabilita todos los cuadros de texto dentro de un div oculto

Qué pasa:

$('#divID').children(":input").prop("disabled", true); // disable

y

$('#divID').children(":input").prop("disabled", false); // enable

Para alternar todas las entradas de los niños (selecciones, casillas de verificación, entrada, áreas de texto, etc.) dentro de un div oculto.

Una solución muy simple (pero no siempre la más conveniente) es eliminar el atributo "nombre" - el estándar requiere que los navegadores no envíen valores sin nombre, y todos los navegadores que conozco cumplen con esta regla.

Quitaría el valor de la entrada o separaría el objeto de entrada del DOM para que no exista para ser publicado en primer lugar.