Domanda C'è un modo per disabilitare un gruppo di elementi del form in una volta?


Mi piacerebbe disabilitare una sezione di elementi di modulo HTML a seconda di alcune condizioni. Questo sembra essere il modo ideale per farlo:

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

Ora, questi due input sono disabilitati. Tuttavia, questo sembra essere totalmente borked su IE8. Gli input apparire disabilitato ma posso ancora digitarli.

Violino (Non come se JsFiddle in realtà lavori in IE8)

Esiste una soluzione cross-browser per questo problema, senza aggiungere Disabilitato ad ogni elemento della forma (che complicherebbe la mia sceneggiatura). Potrei probabilmente fare qualcosa di difficile come selezionare il <fieldset> in jQuery, quindi .each() attraverso tutti gli elementi del modulo e disabilitali - tuttavia, in realtà sto impostando il disabled attributo che utilizza un binding Knockout, quindi non c'è davvero posto per Inserisci tale codice. La mia ultima risorsa è usare un binding Knockout personalizzato che disabiliti anche tutti i bambini, ma le sospiro.


16
2018-03-26 20:32


origine


risposte:


In breve: No. La ragione di questo è perché la mancanza di supporto in IE8 e il disabled attributo sul fieldset elemento.

fonte

In IE7 e IE8, l'attributo disattiva solo gli elementi del modulo in   <legenda>.

Temo che dovresti cercare una soluzione personalizzata come le risposte di altri utenti / il tuo binding personalizzato.


4
2018-03-26 20:49



Ok, ho ideato un'implementazione specifica di Knockout.js che speriamo possa aiutare altre persone nella stessa barca. Questa soluzione potrebbe probabilmente essere adattata per altre soluzioni e piattaforme con un piccolo sforzo.

Innanzitutto, ho creato un binding 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');
         }
      }
   }
};

Nota, dovresti implementare il update metodo anche se si desidera consentire modifiche a questa associazione. Non avevo questo requisito.

È quindi possibile utilizzare il legame in quanto tale:

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

11
2018-03-26 20:55



Soluzione utilizzando jQuery:

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

2
2018-03-26 20:38



Sono stato in grado di fare qualcosa di simile usando un osservabile nel mio modello chiamato editable e poi nel mio input ho usato a data-bind="enable: editable” e questo funziona totalmente in IE 7, 8 e 9.


1
2018-03-26 20:39



Dai l'id al tuo tag fieldset (o puoi anche usare il nome del tag direttamente nel codice jquery) e usa il seguente codice per disattivare tutti i campi in quel fieldset usando jquery.

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


0
2018-04-04 07:04