Enable/Disable 按钮通过 JSF 中的 java 脚本

Enable/Disable button through java script in JSF

我正在做一个 jsf 项目,我必须在其中集成一个小程序来为用户进行图形打印验证。我的小程序工作正常,我从我的小程序到 jsf 页面得到一个布尔值。首先,我的 jsf 形式的命令按钮将被禁用。我只想在我的小程序 return 真值时启用我的 jsf 按钮。我在这里粘贴我的代码。

我的jsf代码是:

<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- <ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    template="/layouts/BasicTemplate.xhtml"
    xmlns:h="http://java.sun.com/jsf/html">
    <ui:define name="content">
        <div> -->

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

<ui:composition template="/layouts/BasicTemplate.xhtml">
    <ui:define name="content">
        <div class="container">

        <script>

        function doAlert(s)
        {
            if(s=="true")
                {
                alert(s);
                rc();
                alert('hi i am');
                }
            else
                {
                 alert("Wrong Finger Print");
                }
        }

        </script>


          <h:form class="form-horizontal" id="myform" >
                <div class="row">
                    <!-- <p:growl id="msgs" sticky="true" showDetail="true" /> -->
            <!-- <div>
                <div>&nbsp;</div>
                <div>
                    <c:if test="${not empty param.login_error}">
                        <div>
                            Your login attempt was not successful, try again.
                            <br/>
                            Reason: #{sessionScope.SPRING_SECURITY_LAST_EXCEPTION.message}
                            <br/>
                        </div>
                    </c:if>
                    <form name="f" action="${request.contextPath}/j_spring_security_check" method="post">
                        <fieldset>
                            <h4>User Login</h4> 
                            <div>
                                <div>
                                    <span>Username:</span>
                                    <c:if test="${not empty param.login_error}">
                                        <c:set var="username" value="${sessionScope.SPRING_SECURITY_LAST_USERNAME}" />
                                    </c:if>
                                    <input type="text" name="j_username" value="#{username}" />
                                    <br/>
                                    <span class="password">Password:</span>

                                    <input type="password" name="j_password" />

                                </div>
                                <div>
                                    <div>
                                        <input name="submit" type="submit" value="Login" />
                                    </div>
                                </div>
                            </div>
                        </fieldset>
                    </form>
                </div> 
            </div> -->


        <h:messages />
        <h:panelGrid columns="3" cellpadding="4" border="0" columnClasses="control-label">

            <h:outputText  value="Username :" />
            <h:inputText id="username" value="#{loginBean.login}" label="username" style="width: 200;" /> 
            <p:watermark for="username" value="Username" ></p:watermark>

            <h:outputLabel for="password" value="Password :" />
            <h:inputSecret id="password" value="#{loginBean.password}" label="password" style="width: 200;"/> 
            <p:watermark for="password" value="Password"></p:watermark>

            <p:spacer></p:spacer>
            <!-- <p:commandButton value="Login" action="#{loginBean.logMeIn}" widgetVar="mybutton" /> -->

            <p:commandButton id="loginButton" value="Login" action="#{loginBean.logMeIn}" widgetVar="mybutton"  disabled="#{!loginBean.enabled}"/>
            <p:remoteCommand name="rc" update="loginButton" actionListener="#{loginBean.enableButton}" /> 
            <p:spacer></p:spacer>
            <h:outputText value="#{loginBean.enabled}"></h:outputText>
            <applet id="fingureprintapplet" name="fingureprint" codebase="classes"  code="fingerprintntscanner.MyClassApplet.class" archive="#{facesContext.externalContext.requestContextPath}/FIngerprintntScanner.jar,#{facesContext.externalContext.requestContextPath}/lib/NBioBSPJNI.jar" width="300" height="400">

            </applet>
        </h:panelGrid>

        </div>
        </h:form>

        </div>
    </ui:define>
</ui:composition>



</html>

启用按钮的脚本是

JS是

    function doAlert(s)
    {
        if(s)
            {
            alert(s);
            rc();
            }
    }

    </script>

Bean 是:

import java.io.Serializable;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.bean.SessionScoped;
import javax.faces.context.FacesContext;


@ManagedBean(name = "loginBean")
@SessionScoped
public class LoginBean implements Serializable {
    private static final long serialVersionUID = 1L;

    private String login;
    private String password;
    private boolean enabled;


    public String getLogin() {
        return login;
    }

    public void setLogin(String login) {
        this.login = login;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }




    public void enableButton() {
        System.out.println("chandan");
        enabled = true;
    }

    public boolean isEnabled() {
        System.out.println("hi");
        return enabled;
    }

    public void setEnabled(boolean enabled) {
        this.enabled = enabled;
    }


}

但没有任何效果。 alert 给我真值和假值。请帮助

您需要通过 JSF 启用按钮,而不是通过 JavaScript/HTML DOM。如果你需要通过 JS 来完成,你可以使用 remoteCommand。这样的事情应该有效:

XHTML:

<p:commandButton id="loginButton" value="Login" action="#{loginBean.logMeIn}" widgetVar="mybutton"  disabled="#{!bean.enabled}"/>

<p:remoteCommand name="rc" update="loginButton" actionListener="#{bean.enableButton}" />

JS:

function doAlert(s)
        {
            if(s)
                {
                alert(s);
                rc();
                }
        }

豆子:

private boolean enabled;

public void enableButton() {
    enabled = true;
}

public boolean isEnabled() {
    return enabled;
}

查看此处的文档: http://www.primefaces.org/docs/guide/primefaces_user_guide_5_0.pdf

Primefaces 命令按钮支持 enable/disable 使用 widgetVar。

所以,用你的按钮

<p:commandButton id="loginButton" value="Login" 
action="#{loginBean.logMeIn}" widgetVar="mybutton"  
disabled="#{!loginBean.enabled}"/>

你可以使用

function doAlert(s)
{
    if(s)
        {
        alert(s);
        myButton.disable(); // or enable()
        }
}

它应该会按预期工作。基本上这里不需要 remote command - 但它也应该可以工作。