Question

我想知道我是否可以冻结或禁用整个更新表单？我有一个输入h：表单，里面有一个复选框。当用户选中此框时，我想冻结或禁用整个表单，以禁止用户更改输入。

谢谢，我正在使用JSF，Spring Web Flow，Facelets和Trinidad。

Answer 1

当用户选中复选框时，您可能希望使用javascript将所有表单输入设置为禁用。类似的东西：

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

您可以为每个输入元素执行此操作，其中'id'是该元素的ID。

Answer 2

如果您只想禁用某些输入，最好枚举它们：

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

Answer 3

您无法一次禁用整个表单。您确实需要禁用每个输入元素。基本上有两种方法可以做到这一点。

第一种方法是在单击复选框时使用Javascript将表单提交给服务器，以便您可以使用JSF组件的disabled属性来禁用元素。这是一个基本的例子：

<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>

此处#{bean.freeze}应指向boolean属性。

第二种方法是为此编写Javascript函数。这不需要表单提交，并使您免于一个HTTP请求 - 响应周期，这对用户体验更有利。

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

JS函数disableForm()基本上很简单。只需将this中的复选框作为函数参数传递，以便您可以通过checkboxElement.form获取父表单，然后按form.elements获取所有表单元素。您只需要确保不禁用复选框本身，以便您可以再次重新启用该表单：）

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;
        }
    }
}

不需要事先知道ID，这使得JS代码具有通用性和可重用性。

希望这有帮助。

如何冻结或禁用更新输入表单

3 个答案: