JSF使用AJAX显示表单

时间:2016-04-23 10:32:25

标签: ajax jsf jsf-2

我想知道这是否可行。我有一个登录表单,用于接收用户的ID和密码。如果它在后端检出,则会显示另一个表单。到目前为止,我实际上是将登录详细信息发送到另一个要处理的xhtml页面。但是,如果用户错误,页面仍会显示。

这是我的代码

的index.xhtml

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
    <title>Index</title>
</h:head>
<h:body>
    <h:form>
        <p>Login</p>
        <h:inputText value="#{jsfbean.username}"/>
        <h:inputText value="#{jsfbean.password}"/>
        <h:commandButton action="#{jsfbean.message}" value="Results Page"/>
    </h:form>
</h:body>
</html>

导航规则

<?xml version='1.0' encoding='UTF-8'?>
<faces-config version="2.2"
          xmlns="http://xmlns.jcp.org/xml/ns/javaee"
          xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
          xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee    http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd">


<navigation-rule>
    <from-view-id>>index.xhtml</from-view-id>
    <navigation-case>
        <from-action>#{jsfbean.getMessage}</from-action>
        <from-outcome>Success</from-outcome>
        <to-view-id>result.xhtml</to-view-id>
    </navigation-case>
    <navigation-case>
        <from-action>#{jsfbean.getMessage}</from-action>
        <from-outcome>Fail</from-outcome>
        <to-view-id>index.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>

jsf bean

 public String getMessage() {
    if(getUser(this.username,this.password)==true){
        this.userID = aUser.getUserid();
        this.secqn = aUser.getSecqn();
        this.secans = aUser.getSecans();
        return "Success";
    }else{
        return "Fail";
    }
}

Structure

1 个答案:

答案 0 :(得分:0)

当用户输入用户名和密码时,您只是重定向到另一个页面。

1)您需要修改您的行动:

 <h:form>
        <p>Login</p>
        <h:inputText value="#{jsfbean.username}"/>
        <h:inputText value="#{jsfbean.password}"/>
        <h:commandButton action="#{jsfbean.authenticateUser}" value="Results Page"/>
    </h:form>

2)在bean中编写action方法

    public String authenticateUser(){
    if (username!=null&&password!=null) {
        // Write your business logic here
        if (username.equals("username")&&password.equals("password")) {
            return "SUCCESS";// In your case it is result
        }
    }
    return "LOGIN";
}

3)添加导航规则

    <navigation-rule>
            <from-view-id>/pages/*</from-view-id>
            <navigation-case>
                <from-outcome>LOGIN</from-outcome>
                <to-view-id>/pages/public/login.xhtml</to-view-id>
            </navigation-case>
            <navigation-case>
                <from-action>#{authenticateController.authenticateUser}</from-action>
                <from-outcome>LOGIN</from-outcome>
                <to-view-id>/pages/public/login.xhtml</to-view-id>
            </navigation-case>
            <navigation-case>
                <from-action>#{authenticateController.authenticateUser}</from-action>
                <from-outcome>SUCCESS</from-outcome>
                <to-view-id>/pages/private/home.xhtml</to-view-id>
                <redirect/>
            </navigation-case>
</navigation-rule>