zoukankan      html  css  js  c++  java
  • JSF 2 button and commandButton example

    In JSF 2.0, both <h:button /> and <h:commandButton /> tags are used to render HTML input element of type button, with different mechanism to handle the navigation.

    1. JSF h:commandButton example

    The “h:commandButton” tag is released since JSF 1.x, you can declare the bean, which return the navigation outcome in the “action” attribute. If browser’s with JavaScript disabled, the navigation is still working, because the navigation is handled via form post.

    1. Submit button

    //JSF
    <h:commandButton value="submit" type="submit" action="#{user.goLoginPage}" />
    
    //HTML output
    <input type="submit" name="xxx" value="submit" /> 
    

    2. Reset button

    //JSF
    <h:commandButton value="reset" type="reset" />
    
    //HTML output
    <input type="reset" name="xxx" value="reset" /> 
    

    3. Normal button

    //JSF
    <h:commandButton value="button" type="button" />
    
    //HTML output
    <input type="button" name="xxx" value="button" /> 
    

    4. Normal button with onclick event

    //JSF
    <h:commandButton value="Click Me" type="button" onclick="alert('h:commandButton');" />	
    
    //HTML output
    <input type="button" name="xxx" value="Click Me" onclick="alert('h:commandButton');" />
    

    2. JSF h:button example

    The “h:button” is a new tag in JSF 2.0, you can declared the navigation outcome directly in the “outcome” attribute, no need to call a bean to return an outcome like “h:commandButton” above. But, if browser’s with JavaScript disabled, the navigation will failed, because the “h:button” tag is generate an “onclick” event to handle the navigation via “window.location.href”. See examples :

    1. Normal button without outcome

    //JSF
    <h:button value="buton" />			
    
    //HTML output
    <input type="button" 
       onclick="window.location.href='/JavaServerFaces/faces/currentpage.xhtml; return false;" 
       value="buton" /> 
    

    P.S if the outcome attribute is omitted, the current page URL will treat as the outcome.

    2. Normal button with an outcome

    //JSF
    <h:button value="buton" outcome="login" />			
    
    //HTML output
    <input type="button" 
       onclick="window.location.href='/JavaServerFaces/faces/login.xhtml; return false;" 
       value="buton" /> 
    

    3. Normal button with JavaScript.

    //JSF
    <h:button value="Click Me" onclick="alert('h:button');" />
    
    //HTML output
    <input type="button" 
       onclick="alert('h:button');window.location.href='/JavaServerFaces/faces/page.xhtml;return false;" 
       value="Click Me" /> 
    

    My thought…

    No really sure why JSF 2.0 released this “h:button” tag, the JavaScript redirection is not practical, especially in JavaScript disabled browser. The best is integrate the “outcome” attribute into the “h:commandButton” tag, hope it can be done in future release.

  • 相关阅读:
    爬虫笔记1
    python逐行读取文件&作成xml文件
    C#.NET自定义下拉框实现选中下拉list的值和显示框内的值不同
    Mongodb笔记
    tomcat启动脚本
    mysql相关函数
    关于SQL_Errno1677导致主从复制中断处理
    mysql慢查询日志切换
    mysql5.7 忘记root密码处理
    Python零基础入门(4)-------简单了解Python是怎么运行
  • 原文地址:https://www.cnblogs.com/ghgyj/p/4765396.html
Copyright © 2011-2022 走看看