file download on JSF

1.pure JSF
重點在最後加上FacesContext.getCurrentInstance().responseComplete()
Reference

2.rifaces way

Reference

3.seam way

Reference

Richfaces on Google App Engine

Live Richfaces on GAE
http://richfaces-showcase-gae.appspot.com/

Source
http://anonsvn.jboss.org/repos/richfaces/trunk/examples/richfaces-showcase/

Build and Run step
http://anonsvn.jboss.org/repos/richfaces/trunk/examples/richfaces-showcase/readme.txt

How To Configure Maven For RichFaces
http://community.jboss.org/wiki/HowToConfigureMavenForRichFaces

Jboss.org Maven Settings Example
http://community.jboss.org/wiki/MavenSettingsExample-Users
http://community.jboss.org/wiki/MavenGettingStarted-Users


Configuring a proxy
http://maven.apache.org/guides/mini/guide-proxies.html

NOTE:
1.If proxy protocol set http , the repository URL must use 'http'.
http://repository.jboss.org/nexus/content/groups/public-jboss/

2.關於readme.txt的第二點2) Publishing to Google Application Engine
執行mvn clean package -Pgae -Denforcer.skip=true之前，必須先修改pom.xml。
將org.glassfish.web的dependency拿掉，改由手動去抓該el-impl.jar，並且放到/richfaces-showcase/src/main/webapp/WEB-INF/lib底下。

3.deploy localhost

JSF on Google App Engine

目前只支援JSF 1.1,

實作元件目前相容的有Myfaces,

但是Richfaces 3.1.6不相容,

幫忙投票讓GAE支援Richfaces,here

一堆東西不能用 囧rz.

HTML EDITOR - TinyMCE

最近案子要用網頁編輯器,因此來回顧多年以前玩的TinyMCE.

需求 :中文化以及可以使用標楷體

1. download Chinese language pack

2. snapshot sample

tinyMCE.init({language : "zh",
theme_advanced_fonts : "新細明體=新細明體;標楷體=標楷體;"...});

BTW , Richfaces的rich:editor元件採用的也是TinyMCE,

現在包成元件用方便多了,clean is beauty and more ajax

Use JSTL on JSF with Facelets

1. version JSTL 1.1
   
2. namespace : xmlns:c="http://java.sun.com/jstl/core"
   
3. Facelets Support : c:if , c:forEach , c:set(少用)
   

最近JSF元件的發展

• 眾所期待的myfaces core終於支援JSF1.2,不過Tomahawk目前尚未支援JSF1.2.
• icefaces 1.6.0(final) release,正式支援第三方的元件Tomahawk,看來richfaces很有可能被取代掉.
• WebGalileo Faces也加入open source的陣營,比icefaces更多元件,尚未支援JSF1.2,對Opera的支援有點差

目前客製化JSF的元件還是相當困難,如果可以做一套符合標準的TOOL來設計元件該有多好

[ICEfaces]支援myafecsTomahawk元件

1.myfaces lib
myfaces-core 1.1.5 & tomahawk v1.1.5

2.icefaces lib
ICEfaces-1.6.0-DR4

3.RI implementation會跟myfaces起衝突,把jsf-api.jar和jsf-impl.jar拿出

4.web.xml設定

(1)加入servlet
   servlet
           servlet-name Main Dispatch Servlet servlet-name
          servlet-class com.icesoft.faces.webapp.http.servlet.MainServlet servlet-class
          load-on-startup 1 load-on-startup
   servlet

   servlet-mapping
           servlet-name Main Dispatch Servlet servlet-name
           url-pattern *.iface url-pattern
   servlet-mapping

(2)將FacesServlet和ExtensionsFilter所mapping的去除,
否則會造成myfaces和icefaces之間無法cast的錯誤

(3)加入context-param
context-param
   param-name
          com.icesoft.faces.standardRequestScope
   param-name
   param-value
          true
   param-value
context-param

(4)加入listener
listener
    listener-class
           com.icesoft.faces.webapp.http.servlet.SessionDispatcher$Listener
    listener-class
listener

5.faces-config.xml設定
若有使用facelets,將view-handler改成com.icesoft.faces.facelets.D2DFaceletViewHandler
取代com.sun.facelets.FaceletViewHandler

參考資料:
Status of ICEfaces Support for MyFaces Tomahawk Components

[Richfaces] modalPanel can not render or not submit

(1)lib
版本使用ajax4jsf-1.1.1和richfaces-3.0.1

(2)使用h:form包在內部
rich:modalPanel id="mp"
            f:facet name="header"            f:facet
            f:facet name="controls"          f:facet
            h:form
            ...
            h:form
rich:modalPanel



尚未解決的問題:
借由datatable修改下筆資料時,modelPanel沒有繪製新的資料,而是保留之前的

[Richfaces] Configure Skin

Richfaces內訂七種skin:
DEFAULT,emeraldTown,wine,japanCherry,ruby,classic,deepMarine.
可以即時變換Richfaces元件的外觀.

透過這兩個簡單的步驟,即可抽換skin
1.Configure your web.xml
context-param
param-name org.ajax4jsf.SKIN /param-name
param-value #{skinBean.skin} /param-value
/context-param

2.使用backing bean從view端接收使用者所選擇的參數,
注意skin的屬性名稱只包含這七種:
DEFAULT,emeraldTown,wine,japanCherry,ruby,classic,deepMarine

以下是實例:
1.SkinBean.java(包含skin屬性以及set和get)

主要是透過此方法取得skin屬性名稱
private String getSkinParam(){
FacesContext fc = FacesContext.getCurrentInstance();
String param = (String) fc.getExternalContext().getRequestParameterMap().get("s");
if (param!=null && param.trim().length()>0) {
return param;
} else {
return null;
}
}

2.skin.xhtml

h:form
h:outputLink blueSky f:param value="blueSky" name="s" /h:outputLink
h:outputLink classic f:param value="classic" name="s" /h:outputLink
/h:form

3.LIVE_DEMO


以下是我目前碰到的狀況:
1.stack overflow
起因:似乎是form過多
解法:在那個頁面不讓使用者選擇skin,而是從別的頁面選擇skin

2.null exception
起因:在request scope的頁面選擇skin,造成原本的bean從component tree已經消失
解法:把scope設定成session(尚未測試)

3.選完skin之後,頁面回到上一頁
起因:如果是以h:outputLink的方式來傳遞參數,會遇到導向的問題
解法:重新導向頁面

Enhance performance on Tomahawk with facelets

Reference Performance

最近注意到JSF的SESSION吃滿重的,雖然說可以設定其他的scope,

但有許多行為必須靠session來達成,只好試著把session的負擔減輕,

不過至少不會比Wicket肥==+
1.Add there tag in tomahawk.taglib.xml.
tag>
tag-name>document /tag-name>
component>
component-type>org.apache.myfaces.Document /component-type>
/component>
/tag>

tag>
tag-name>documentHead /tag-name>
component>
component-type>org.apache.myfaces.DocumentHead /component-type>
/component>
/tag>

tag>
tag-name>documentBody /tag-name>
component>
component-type>org.apache.myfaces.DocumentBody /component-type>
/component>
/tag>

2.Add this in web.xml.
context-param>
param-name>javax.faces.STATE_SAVING_METHOD /param-name>
param-value>server /param-value>
/context-param>

context-param>
param-name>org.apache.myfaces.ADD_RESOURCE_CLASS /param-name>
param-value>org.apache.myfaces.component.html.util.StreamingAddResource /param-value>
/context-param>

context-param>
param-name>org.apache.myfaces.COMPRESS_STATE_IN_SESSION /param-name>
param-value>false /param-value>
/context-param>

context-param>
param-name>org.apache.myfaces.SERIALIZE_STATE_IN_SESSION /param-name>
param-value>false /param-value>
/context-param>

context-param>
param-name>org.apache.myfaces.NUMBER_OF_VIEWS_IN_SESSION /param-name>
param-value>20 /param-value>
/context-param>

3.Change html,head and body on web page.
t:document -> html
t:documentHead -> head
t:documentBody -> body

JSF IDE

以下這三者皆可視覺化設計JSF,根據個人的經驗提出以下見解

1.NETBEAN
優點:
開發速度很快,而且文件滿詳細的.
元件可以即時從design移動位置.
自訂許多很方便的元件,文件也說明的很清楚.

缺點:
我的小老婆有點吃力.
拉出來的CODE滿難懂,或許是希望開發著都從design端著手,像dreamweaverㄧ樣,少看code.
如果案子有問題還是要修改,必須改code,頭就非常大了.
需要花時間了解其自訂的元件如何使用.
支援AJAX的元件還不多.


2.Java Studio Creator
優點:
開發速度很快

缺點:
我的小老婆跑不動,所以直接出局XD


3.Exadel Studio Pro
優點:
支援的元件很多Ajax4jsf,Myfaces,ADFaces,facelets.
其公司就是Richfaces的開發者,研發出支援ajax的元件.

缺點:
我的小老婆有時候會當,將eclipse所用的記憶體調高到512M以上,即可解決.
元件無法從design移動,必須修改code來移動.
怎會沒有納入ICEfaces的元件,怕被搶生意?
不是所有元件都可以視覺化預覽..囧

結語:
個人推薦的是Exadel,最近已經整合到JBoss中,正名成Red Hat Developer Studio,並且不再收錢了!!
看來這次大老們都硬起來了,希望能爲JSF注入新的活力.
將Seam整合進去之後,RHDS能把Seam的code generator發揮到什麼境界?令筆者相當期待.
不過還在研發中,有興趣的人可以先玩Exadel Studio Pro

LOGOUT IN JSF

一般我們在登出時會只接把SESSION清除
FacesContext fc = FacesContext.getCurrentInstance();
HttpSession session = (HttpSession) fc.getExternalContext().getSession(false);
session.invalidate();

但是在JSF其session會紀錄額外的資訊,
如果移除掉會造成JSF的component tree無法render,
對此有兩種解法:

1.移除其相關的attribute就好
session.removeAttribute

2.使用filter來管理權限問題

facelets

錯誤訊息:Invalid byte 1 of 1-byte UTF-8 sequence
起因:無法顯示中文
解法:使用編輯器將編碼改成UTF-8 or big5

錯誤訊息:well form
起因:必須符合XML格式
解法:TAG必須含有結尾Ex:<> < / p >

錯誤訊息:Duplicate component ID '_id21:annoData:_id23' found in view
起因:元件的ID重覆
解法一:
依照錯誤訊息的Component Tree找出重覆的ID元件,
將該元件的ID重新命名成別的ID
解法二:
依照本身的案子,只要把outputText改成直接輸出而不使用outputText元件

錯誤訊息:Target Unreachable, 'anno' returned null
起因:myfaces和jsf的元件衝突
解法:刪除jsf-api.jar和jsf-impl.jar

錯誤訊息:Child count should be a multiple of the columns attribute
起因:t:column內太多元件
解法:刪除多餘的元件

錯誤訊息:點選之後出現空白頁
起因:以下兩道語法icefaces不支援,myfaces可以
meta http-equiv="refresh" content="2;url=./query/dorm_annoAction.do.jsp"
jsp:forward page="./query/dorm_annoAction.do.jsp"
解法:
若使用facelets+icefaces不使用外部來redirect

錯誤訊息:form送不出去
起因:panelGrid內不能render使用jsfc包含的元件commandButton
解法:不使用jsfc採用原本的語法

[Myfaces] Tomahawk

優點:
Ajax4jsf支援
文件好一點點

缺點:
元件對AJAX支援還不多
尚未支援JSF1.2

BUG:
1.inputDate
error1:若驗證沒過,inputDate輸入新的時間server抓不到,而是抓到ㄧ開始輸入的
解:拿其他元件代替(ex.inputCalendar)

error2:二月份時,元件會多加ㄧ變三月
解:
c:if test="${sessionScope.anno_end.month == 2}"
jsp:setProperty name="anno_end" property="month"
value="${sessionScope.anno_end.month-1}"

2.inputCalendar
error:使用outputText會少一天
解:
t:inputCalendar displayValueOnly="true" renderAsPopup="true"
readonly="true" value="#{date}"
取代
h:outputText value="#{date}"

3.panelTabbedPane
缺:與其他複雜元件共用很容易出錯
解:不要和複雜元件混用

4.inputHtml
缺:對IE支援差
解:改用TinyMCE(有支援中文化) or Dojo Editor

[Myfaces] Trinidad

優點:
Ajax4jsf支援
元件相當成熟
支援JSF1.2

多數都是以alert跳出視窗提示錯誤

時間的元件有用到FOCUS

可以改變外觀

特殊元件:
media.
showManyAccordion.(影藏或顯示更詳細的資訊)
client Date Restriction Validator(在CLIENT驗證時間的範圍)
Dialog Framework Demo(跳出視窗的互動)
addRow(dataModel增加一空白欄位)
totalRow(計算dataModel的total總值)
attributeChange_Implicit(全選/全部不選)
addRemoveReorderChildrenChange_Explicit(可以增加刪除元件)

Explicit Change registration(可以增加刪除元件)

progressIndicator(動態顯示進度)


缺點:
不能和MYFACES其他元件共用
不支援OPERA
效率差

[Myfaces] Tobago

優點:
驗證可以會將錯誤的部份框起來
有支援ALERT
可以變換外觀themes
時間的元件有用到FOCUS
 
tc:popup
tx:in suggestMethod類似autocomplete
tc:validateSubmittedValueLength
tx:time 使用上下捲動的選單

tc:sheet和tc:toolBar可以改變dataScroller的外觀


缺點:
只能有一render,與其他ㄉ元件共用性可能不好
MYFACES其他ㄉ確定不能共用
Ajax4jsf不確定(似乎不行)