Comment bloquer ou désactiver une forme d'entrée de mise à jour

Question

Je me demande s'il est possible pour moi de geler ou de désactiver la totalité du formulaire de mise à jour? J'ai une entrée h: formulaire avec une case à cocher dedans. lorsque les utilisateurs cochent la case, je souhaite geler ou désactiver le formulaire entier afin d'empêcher les utilisateurs de modifier les entrées.

Merci, et je suis en utilisant JSF, Spring Web Flow, Facelets et Trinidad.

Answer 1

Si vous souhaitez désactiver certaines entrées seulement, il est une bonne idée de les énumérer:

function OptCheckBox(chkd) { 
if (chkd == 'y') { 
    document.frm.input1.disabled = true; 
    document.frm.input2.disabled = true; 
} 
} 

Answer 2

Vous souhaitez utiliser javascript pour définir toutes les entrées de formulaire pour personnes à mobilité réduite lorsque l'utilisateur vérifie la case à cocher. Quelque chose comme:

document.getElementById('id').disabled = true; 

Vous devez faire cela pour chaque élément d'entrée où « id » est l'identifiant de cet élément.

Answer 3

Vous ne pouvez pas désactiver toute une forme à la fois. Vous devez vraiment désactiver chacun des éléments d'entrée. Il y a essentiellement deux façons d'y parvenir.

La première façon consiste à utiliser Javascript pour soumettre le formulaire au serveur lorsque la case est cochée, afin que vous puissiez utiliser l'attribut disabled du composant JSF pour désactiver les éléments. Voici un exemple de base:

<h:form> 
    <h:selectBooleanCheckbox value="#{bean.freeze}" onclick="submit()" /> 
    <h:inputText value="#{bean.value1}" disabled="#{bean.freeze}" /> 
    <h:inputText value="#{bean.value2}" disabled="#{bean.freeze}" /> 
    <h:inputText value="#{bean.value3}" disabled="#{bean.freeze}" /> 
</h:form> 

Ici #{bean.freeze} devrait pointer vers une propriété boolean.

deuxième façon est d'écrire une fonction Javascript pour cela. Cela ne nécessite pas de soumission de formulaire et vous évite un cycle de requête-réponse HTTP, ce qui est préférable pour l'expérience utilisateur.

<h:form> 
    <h:selectBooleanCheckbox onclick="disableForm(this)" /> 
    <h:inputText value="#{bean.value1}" /> 
    <h:inputText value="#{bean.value2}" /> 
    <h:inputText value="#{bean.value3}" /> 
</h:form> 

La fonction JS disableForm() est fondamentalement simple. Il suffit de passer la case à cocher en fonction comme argument par this de sorte que vous pouvez obtenir le formulaire parent par checkboxElement.form et obtenir tous les éléments de formulaire par form.elements. Vous ne devez vous assurer que vous ne désactivez pas la case à cocher lui-même, afin que vous puissiez réactiver à nouveau le formulaire :)

function disableForm(checkboxElement) { 
    var elements = checkboxElement.form.elements; 
    for (var i = 0; i < elements.length; i++) { 
     var element = elements[i]; 
     if (element != checkboxElement) { 
      element.disabled = checkbox.checked; 
     } 
    } 
} 

Pas besoin de savoir à l'avance de l'ID, ce qui rend le code JS générique et réutilisable.

Espérons que cela aide.