`
tntxia
  • 浏览: 1507401 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

简单的导航 Navigation

阅读更多
第一个JSF程序 中,我们简单的定义了页面的流程由 index.jsp 到 welcome.jsp,接下来我们扩充程序,让它可以根据使用者输入的名称与密码是否正确,决定要显示欢迎讯息或是将使用者送回原页面进行重新登入。

  首先我们修改一下UserBean:

UserBean.java
package
 onlyfun.caterpillar;

 public
 class UserBean {
    private
 String
 name;
    private
 String
 password;
    private
 String
 errMessage;

    public
 void setName(String
 name) {
        this
.name = name;
    }

    public
 String
 getName() {
        return
 name;
    }

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

    public
 String
 getPassword() {
        return
 password;
    }

    public
 void setErrMessage(String
 errMessage) {
        this
.errMessage = errMessage;
    }

    public
 String
 getErrMessage() {
        return
 errMessage;
    }

    public
 String
 verify() {
        if
(!name.equals("justin"
) ||
           !password.equals("123456"
)) {
            errMessage = "名称或密码错误"
;
            return
 "failure"
;
        }
        else
 {
            return
 "success"
;
        }
    }
 }

  在UserBean中,我们增加了密码与错误讯息属性,在verify()方法中,我们检查使用者名称与密码,它传回一个字符串,"failure"表示登入错误,并会设定错误讯息,而"success"表示登入正确,这个传回的字符串将决定页面的流程。

  接下来我们修改一下 faces-config.xml 中的页面流程定义:

faces-config.xml
<?xml version="1.0"
?>
 <!DOCTYPE faces-config PUBLIC
 "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"


 "http://java.sun.com/dtd/web-facesconfig_1_0.dtd"
>


 <faces-config>
    <navigation-rule>
        <from-view-id>/pages/index.jsp</from-view-id>
        <navigation-case
>
            <from-outcome>success</from-outcome>
            <to-view-id>/pages/welcome.jsp</to-view-id>
        </navigation-case
>
        <navigation-case
>
            <from-outcome>failure</from-outcome>
            <to-view-id>/pages/index.jsp</to-view-id>
        </navigation-case
>
    </navigation-rule>

    <managed-bean>
        <managed-bean-name>user</managed-bean-name>
        <managed-bean-class>
            onlyfun.caterpillar.UserBean
        </managed-bean-class>
        <managed-bean-scope>session</managed-bean-scope>
    </managed-bean>
 </faces-config>

  根据上面的定义,当传回的字符串是"success"时,将前往 welcome.jsp,如果是"failure"的话,将送回 index.jsp。

  接下来告诉网页设计人员Bean名称与相关属性,以及决定页面流程的verify名称,我们修改 index.jsp 如下:

index.jsp
<%@ taglib uri="http://java.sun.com/jsf/core"
 prefix="f" %>

 <%@ taglib uri="http://java.sun.com/jsf/html"
 prefix="h" %>

 <%@page contentType="text/html;charset=Big5"
%>
 <html>
 <head>
 <title>第一个JSF程序</title>
 </head>
 <body>
    <f:view>
        <h:form>
            <h3>请输入您的名称</h3>
            <h:outputText value="#{user.errMessage}"
/><p>
           名称: <h:inputText value="#{user.name}"
/><p>
           密码: <h:inputSecret value="#{user.password}"
/><p>
            <h:commandButton value="送出"

                             action="#{user.verify}"
/>
        </h:form>
    </f:view>
 </body>
 </html>

  当要根据verify运行结果来决定页面流程时,action属性中使用 JSF Expression Language "#{user.verify}",如此JSF就知道必须根据verify传回的结果来导航页面。

  <h:outputText>可以取出指定的Bean之属性值,当使用者因验证错误而被送回原页面时,这个错误讯息就可以显示在页面上。

分享到:
评论

相关推荐

    Kotlin中使用BottomNavigationView实现底部导航

    Kotlin作为Google推荐的Android开发语言,其简洁的语法使得与BottomNavigationView的集成变得更为简单。本文将深入探讨如何在Kotlin中利用BottomNavigationView来实现底部导航,并结合小红点消息提示功能,提升用户...

    xcode 4的简单navigation+tableviewcontroller

    本教程将深入探讨如何使用Xcode 4创建一个简单的Navigation-based应用程序,结合UITableViewController来实现用户友好的界面导航。 Navigation Controller是iOS中一种常见的界面组织方式,它为用户提供了一种在多个...

    返滴滴打车首页功能,左侧导航NavigationView自定义,底部菜单可上下滑动

    比网上别人各种忽略人下载的强多了,实际项目中拆分出来分享给大家的,谢谢支持,有问题按代码中的邮箱联系,另外说明,左侧导航底部也可以直接用NavigationView中的app:menu 设置,不过此方式貌似只能定义纵向的...

    BottomNavigationView+ViewPager+Fragment底部导航栏

    在“BottomNavigationView+ViewPager+Fragment底部导航栏”的实现中,我们首先需要设置`BottomNavigationView`,它通过`Menu`资源定义菜单项,并使用`NavigationItemSelectedListener`来监听用户选择的菜单项变化。...

    Android Studio 导航栏开发 BottomNavigationView+Fragment 简单实例 适合新手

    Android Studio 导航栏开发 BottomNavigationView+Fragment 简单实例 https://blog.csdn.net/nujun1222/article/details/80079345

    简单的TabBar和Navigation结合的例子

    本示例项目"简单的TabBar和Navigation结合的例子"旨在帮助开发者理解如何将这两种控件有效地结合起来,为用户提供更加直观且易用的交互体验。 TabBar,全称为Tab Bar Controller,它是iOS中的一个容器视图控制器,...

    Android Jetpack 之Navigation组件demo

    在`NavigationDemo`项目中,你可以找到一个简单的示例,展示了如何创建Navigation资源、定义导航图,并在代码中使用`NavController`进行导航。这个例子包含了两个Fragment,通过底部导航栏或回退按钮实现它们之间的...

    IOS应用源码——Navigation(导航控制器).zip

    在iOS中,用户通常会通过点击屏幕上的按钮或滑动来浏览不同的页面,Navigation Controller则帮助我们管理这种导航流程,使得返回上一级视图变得简单直观,只需轻触屏幕顶部的“Back”按钮即可。 在源码中,我们可能...

    cesium-navigation-es6 Cesium指南针,import的方式

    虽然没有提供具体的demo,但是通常,一个简单的Cesium集成cesium-navigation-es6的示例代码会像上面那样工作。对于更复杂的用法,如自定义样式、事件处理等,你可能需要查阅cesium-navigation-es6的文档或源代码,...

    [个人实战]React Native项目中Navigation的使用

    例如,创建一个简单的栈导航: ```javascript import { createStackNavigator } from '@react-navigation/stack'; import HomeScreen from './screens/HomeScreen'; import DetailsScreen from './screens/...

    安卓抽屉效果相关-导航抽屉navigationdrawer是一个从屏幕左边滑入的面板用于显示应用的主要导航项目。此为导航抽屉的一个简单框架稍加修改就能用。.zip

    导航抽屉(navigationdrawer)是一个从屏幕左边滑入的面板,用于显示应用的主要导航项目。 此为导航抽屉的一个简单框架,稍加修改就能用。.zip,太多无法一一验证是否可用,程序如果跑不起来需要自调,部分代码功能...

    Easy Navigation 简易的静态导航站

    【Easy Navigation简易静态导航站】是一个简单而实用的网页导航解决方案,主要依赖于nginx服务器来托管静态页面,并结合json数据动态生成导航栏。这个项目旨在提供一个轻量级且易于维护的导航系统,适合个人博客、...

    a unified approach to proportional navigation

    本文旨在通过一种统一的方法,对比例导航中的两个主要类别——真比例导航(True Proportional Navigation, TPN)和纯比例导航(Pure Proportional Navigation, PPN)进行综合分析。 #### 比例导航概述 比例导航的...

    Navigation

    在移动应用开发中,"Navigation"一词通常指的是应用程序中的导航设计,它是用户在不同页面或功能之间切换的系统。导航设计是用户体验的关键组成部分,它决定了用户如何在APP中找到他们需要的信息或功能。现在,我们...

    简单的上导航,左侧导航

    "简单的上导航,左侧导航"这个标题描述了一种常见的网页布局模式,下面将详细解释这种布局方式及其相关知识点。 1. 上导航(Top Navigation): 上导航是指位于页面顶部的菜单栏,通常包含网站的主要类别或功能。...

    react-ReactNavigation带有自定义动画的TabBarComponent

    在React Native应用开发中,React Navigation是一个非常流行的导航库,它提供了一套强大的导航解决方案,使得在移动应用中切换屏幕变得简单。本教程将聚焦于如何在React Navigation中实现一个带有自定义动画的...

    侧滑菜单NavigationView

    在Android应用开发中,侧滑菜单(通常称为NavigationView)是一个非常常见的组件,它允许用户从屏幕边缘滑动来展示一个包含导航选项的菜单。NavigationView在Android Design Support Library中被引入,目的是为了...

    fankuai.rar_navigation_俄罗斯方块_车载导航

    《车载导航中的游戏应用:深度解析“fankuai.rar_navigation_俄罗斯方块”》 车载导航系统,作为现代汽车智能化的重要组成部分,不仅提供精准的路线指引,还日益融入丰富的娱乐功能,以提升驾驶体验。其中,...

    Android使用导航视图NavigationView的代码例子

    在Android开发中,NavigationView是一个非常重要的组件,它通常被用作侧滑菜单,与 DrawerLayout 结合使用,为用户提供一种常见的导航方式。在本示例中,我们将深入探讨如何在项目中实现这样的功能,以及如何对其...

    android NavigationView的使用

    通过合理配置和定制,它可以提供优雅的用户体验,并且与`DrawerLayout`和其他组件的无缝配合,使得在Android应用中实现导航功能变得更加简单。在实际项目中,开发者应根据需求灵活运用这些特性,以打造符合设计规范...

Global site tag (gtag.js) - Google Analytics