javascript - para - ¿Hay alguna manera de desactivar un montón de elementos de formulario a la vez?



validar formulario javascript html5 (4)

Me gustaría deshabilitar una sección de elementos de formulario HTML según algunas condiciones. Esta parece ser la forma ideal de hacerlo:

<fieldset disabled>
    <input value="one" />
    <input value="two" />
</fieldset>

Ahora, esas dos entradas están deshabilitadas. Sin embargo, esto parece estar totalmente modificado en IE8. Las entradas aparecen deshabilitadas pero aún puedo escribirlas.

Fiddle (No es como si JsFiddle realmente funciona en IE8)

¿Existe una solución de navegador cruzada para este problema, sin agregar deshabilitado a cada elemento de formulario (lo que complicaría mi secuencia de comandos). Probablemente podría hacer algo complicado como seleccionar <fieldset> en jQuery, luego .each() través de todos los elementos del formulario y deshabilitarlos. Sin embargo, estoy configurando el atributo disabled utilizando un enlace Knockout, así que realmente no hay lugar para agregar tal código. Mi último recurso es usar un enlace Knockout personalizado que también deshabilita a todos los niños, pero suspiro.

https://src-bin.com


Answer #1

Entregue el ID a su etiqueta fieldset (o también puede usar el nombre de la etiqueta directamente en el código jquery) y use el siguiente código para desactivar todos los campos en ese fieldset usando jquery.

$ ("# fieldset id" o "fieldset"). children (). attr ("disabled", "disabled");


Answer #2

De acuerdo, se me ocurrió una implementación específica de Knockout.js que con suerte ayudará a otras personas en el mismo barco. Esta solución probablemente podría adaptarse para otras soluciones y plataformas con un poco de esfuerzo.

Primero, creé un enlace Knockout:

ko.bindingHandlers.allowEdit = {
   init: function(element, valueAccessor)
   {
      if(!valueAccessor())
      {
         element.disabled = true;
         element.readOnly = true;

         if(element.tagName === 'FIELDSET')
         {
            $(':input', element).attr('disabled', 'disabled');
         }
      }
   }
};

Tenga en cuenta que también debe implementar el método de update si desea permitir cambios en este enlace. No tenía este requisito

A continuación, puede utilizar el enlace como tal:

<fieldset data-bind="allowEdit: someExpression">
   <input value="One" />
   <input value="Two" />
</fieldset>

Answer #3

Pude hacer algo similar usando un observable en mi modelo llamado editable y luego en mi entrada usé un data-bind="enable: editable” y esto funciona totalmente en IE 7, 8 y 9.


Answer #4

Solución usando jQuery:

var disabledFiedset=$('fieldset[disabled]');
$('input',disabledFiedset).attr('disabled','disabled');




knockout.js