如何在JavaScript中禁用/启用JSF输入字段? [英] How to disable/enable JSF input field in JavaScript?

问题描述

我有一个inputField或其他标记，我希望在用户单击它时禁用它.

I have an inputField, or some other tag , that I want to be disabled unitl user clicks on it.

类似这样的东西，但是我无法在JSF中使用它.

Something like this, but I cant get it to work in JSF.

$("div").click(function (evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});

我在输入字段中添加disabled = true"，并在< h:form>上设置div值(在这种情况下，所有父标记只有一个)，类似于j_idt13和输入字段的div，因此"div"值看起来像 j_idt13:inputID

I add disabled=true" to my input field, and div value set on < h:form > (all parent tags in this case only one), something like j_idt13 and div of input field, so "div" value looks like j_idt13:inputID

有人可以用jQuery solutin帮助我吗?

Can someone help me with jQuery solutin?

我很想知道它可以在JSF中完成，以及如何实现.

I wold like to know can it be done in JSF, and how.

推荐答案

您需要通过服务器端而不是客户端来切换它. JSF是基于状态组件的MVC框架，可以保护这种方式免遭篡改/被黑客入侵的请求，其中最终用户使用客户端语言/工具(例如HTML或JS)来操纵HTML DOM树和/或HTTP请求参数，以使JSF的结果disabled，readonly或什至rendered属性已更改.

You need to toggle it via server side, not via client side. JSF as being a stateful component based MVC framework safeguards this way against tampered/hacked requests wherein the enduser uses client side languages/tools like HTML or JS to manipulate the HTML DOM tree and/or HTTP request parameters in such way that the outcome of JSF's disabled, readonly or even rendered attribute is altered.

想象一下，如果JSF开发人员将用户角色检查为boolean属性，而不是像disabled="#{not user.hasRole('ADMIN')}"这样的管理员角色，并且黑客以这种方式操纵了该角色，即不再禁止非管理员用户使用它，那将会发生什么.这就是为什么您只能通过服务器端更改提到的属性(以及required属性以及所有转换器，验证器，事件侦听器等)的原因.

Imagine what would happen if the JSF developer checked an user's role in such a boolean attribute against the admin role like so disabled="#{not user.hasRole('ADMIN')}" and a hacker manipulated it in such way that it isn't disabled anymore for non-admin users. That's exactly why you can only change the mentioned attributes (and the required attribute and all converters, validators, event listeners, etc) via the server side.

您可以在任何<f:ajax> > ClientBehaviorHolder 组件即可达到要求.您可以让JSF通过<h:panelGroup layout="block">生成HTML <div>，它也是一个ClientBehaviorHolder:

You can use <f:ajax> in any ClientBehaviorHolder component to achieve the requirement. You can let JSF generate a HTML <div> via <h:panelGroup layout="block">, which is also a ClientBehaviorHolder:

<h:form>
    <h:panelGroup layout="block">
        Click this div to toggle the input.
        <f:ajax event="click" listener="#{bean.toggle}" render="input" /> 
    </h:panelGroup>
    <h:inputText id="input" ... disabled="#{not bean.enabled}" />
</h:form>

使用此@ViewScoped托管bean(出于

With this @ViewScoped managed bean (@RequestScoped wouldn't work for reasons mentioned in #5 of commandButton/commandLink/ajax action/listener method not invoked or input value not updated):

@Named
@ViewScoped
public class Bean implements Serializable {

    private boolean enabled;

    public void toggle() {
        enabled = !enabled;
    }

    public boolean isEnabled() {
        return enabled;
    }

}

另请参见:

• 为什么JSF在服务器上保存UI组件的状态?

See also:

• What is the need of JSF, when UI can be achieved from CSS, HTML, JavaScript, jQuery?
• Why JSF saves the state of UI components on server?

无关，与具体问题无关，如果您实际上对如何通过JS/jQuery获取JSF组件的HTML表示感兴趣，请转到以下答案:

Unrelated to the concrete problem, head to the following answers in case you're actually interested in how to obtain the HTML representation of JSF components via JS/jQuery:

• 如何使用jQuery选择JSF组件?
• How to select JSF components using jQuery?
• How can I know the id of a JSF component so I can use in Javascript

这篇关于如何在JavaScript中禁用/启用JSF输入字段?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！