JSF

最近GLO需要学习JSF,在coreservlet上猛看,一个星期要搞定,有挑战性,看了大概7-8章了:

  • 环境:Tomcat7+java6, eclipse3.6 , OSX,JSF2.0->SRI mujarra。
  • 在eclipse的server中启动tomcat的时候,它自己有一个webapp的文件夹,所以如果要想看到那个熟悉的猫启动页面,需要将tomcat下面的root文件夹拷贝到workspace\.metadata\.plugins\
    org.eclipse.wst.server.core\tmp0\wtpwebapps下面。
  • JSF现阶段感觉最重要是可以将很多繁琐的html和请求处理转发等步骤交给框架来处理,自己只专注于逻辑,并且对于ajax有良好的支持。比起struts来有更多的图形library。
  • 在表格中输入时可以直接将用户的输入装入bean的指定property中,用setxxx
  • 在需要用bean的property时,同样可以直接#{}来调用,用getxxx
  • 在处理请求时,可以直接return “xxx”,就指向同一个folder下面的xxx.xhtml.比较方便。
  • bean前面需要加@managedBean来达到直接用el调用的目的
  • 不同的scope可以用annotation轻易的实现,并且有多达6种scope,暂时还没有完全理解其他3种
  • @ManagedProperty可以实现简单的依赖注入
  • JSF中bean一般分为3部分:
  1. 用户输入需要populate的entity
  2. 处理用户输入的方法
  3. 处理完结果populate的result entity
  • 页面跳转的时候可以在face-config中用wild card来实现页面的重复利用
  • 也可以用render实现条件跳转
  • #{}中的property是可以嵌套的,也可以用list,array(需要用到参数[number],map时也可以[key]).
  • 在face-config中可以定义.property file的映射,实现直接调用property中的参数。

Feb 23th 2011:

  • GUI event 分为 actionController和EventListener,前者处理表格提交,需要跟服务器交互,后者只是处理页面GUI的一些变化,不提交到后台。感觉ajax正是这两个好处的结合体
  • JSF2.0有自己的ajax库,用render指定页面需要更新的id元素。页面前面需要加 xmlns:f=”http://java.sun.com/jsf/core&#8221; 以及<h:head>。execute指定需要提交到后台的参数id,也可以用@form来提交整个form的参数(多个参数的时候比较方便)。

Feb 24th 2011:

  • validation结合的比较方便。可以:
    1. 手动validate,自己写方法,提交的时候到这个方法,然后对了的话就直接显示对应页面,错了就往context的addMessage里加消息然后显示,并且返回null以实现form的redisplay。在redisplay时可以用<h:messages styleClass=”error”/>,error是css中的一个class,这样来实现对error message的样式自定义,当然,它自身默认会用ul显示,也可以指定table,这个css只是指定字体什么的。
    2. implicit validate: 用jsf自己的方法validate。需要的是在input的field里加上required=”true”,对应的message以及自己的id,然后后面加上<h:message for=”userID” styleClass=”error”/>就可以了。这样当有错误的时候,表格redisplay时message会自动附在后面。  如果定义了非String类型如int,double等还可以用 converterMessage=”Amount must be a number”,jsf会自动将传过来的String parse成自定义的类型,如果失败就显示相应message,方便!
    3. explicit validate: 可以自己定义规则来validate,可以用到比如<f:validateLength minimum=”5″ maximum=”6″/> 并且要message出要加上validatorMessage=”…” ,这样就看根据自定义来validate了。
    4. validator 方法: 可以自己定义validator方法,<h:inputText id=”someID” validator=”#{someBean.someMethod}”/> 后面附上<h:message for=”someID”/>,这样只要在方法中Throw ValidatorException就可以让page redisplay并且显示message。

2/25 2011:

  • ui:repeat的应用,想循环一样,用于显示collection中的数据。
  • <ul> <ui:repeat var=”color” value=”#{item.availableColors}”><li>#{color}</li></ui:repeat> /uepea</ul>
  • 可以用span 来specify用css中的哪个类
  • <h:dataTable>用来将collection中数据显示在自定义的各个Column之内
  • status用于表示当前位置,如status.index>5 xxx, 或者boolean的 status.last表示是否最后一个元素
  • render加conditions同样用于判断
  • ui:repeat有高级参数如offset,size,step等

2/27/2011 上午

  • <h:dataTable>有丰富的应用,基本的格式是(类似于一个loop):
    <h:dataTable var=”someVar” value=”#{someCollection}”border=”…”>
    <h:column>#{someVar.property1}</h:column>
    <h:column>#{someVar.property2}</h:column>
    …</h:dataTable>
  • 页面顶端需要加上:
    xmlns:f=”http://java.sun.com/jsf/core&#8221;  在用f:facet的时候需要,如加heading
    xmlns:h=”http://java.sun.com/jsf/html&#8221;  在用h:form, h:outputText时候需要
  • 加上heading时:在对应的Column中间添加 <f:facet name=”header”>First Heading</f:facet>
  • 添加css:在<h:dataTable>括号内部加 styleClass=”tableStyle”或者具体的css类如:headerClass=”headerStyle”, rowClasses=”row1,row2″, columnClasses=”col1,col2,col3″。 在row的css中,是奇偶交替知道最后,Column则是对应具体的某行。
  • ajax动态更新表,例如可先添加一个下拉框:
    <h:selectOneMenuvalue=”#{companyInfocompanyName}“>
    <f:selectItems value=”#{companyInfo.companyChoices}”/>
    <f:ajax render=”programmerTable”/>  //这里指定需要更新的部分的id。
    </h:selectOneMenu>
    然后给对应要更新的表格加上id= programmerTable,即可在下拉框的数据变化时更新表格中的数据,当然,下拉框跟表格要有对应的数据指针。

2/27/2011 下午

  • JSF中同样可以像jsp里include一样reuse page,不过功能先进一些。常规步骤如下:
    1. 在template中Mark replaceable regions with ui:insert
    2. 在client file中Use ui:composition to designate template that is used
    3. 在client file中Override replaceable regions with ui:define
    4. 如果包含其他page,则Insert snippets with ui:include
    5. define和include经常要嵌套使用
  • 相对路径的处理,如果在href里直接写file name,那么会指向这个文件所在目录的那个文件名文件,solution
    • 在<h:outputScript/ outputStylesheet/ outputLink等tag中用library=“xx”,xx它会指向resources下的xx文件夹。
    • images可以跟resources在同一级目录,那可以用<h:graphicImage url=”/images/some-image-1.jpg”/>来输出。
    • jsf可以用 href=”#{request.contextPath}/xx.jsf” 来输出,#{request.contextPath}会指向context root。

2/27/2010 晚上

  • 利用composite component可以实现更加强大的reuse,一般格式:
  • 需要传递参数的话,<composite:interface>
    <composite:attribute name=”attributeName”/>
    </composite:interface>
    然后implementation里的对应是:…#{cc.attrs.attributeName}…
    使用,如参数是message:<someDir:someFile message=”test”/>
  • ui:repeat同样可以在composite components中使用
  • components同样可以Nested,跟使用双重循环一样,参数级级传递。
    母级implementation参数refer:…#{cc.attrs.attributeName}…
    子级implementation参数refer:…#{cc.parent.attrs.attributeName}…
  • 相对路径的处理跟ui:define/insert使用相同,用library=xxx来refer resources目录下的各个文件夹。

2/28/2011

  • 为了能实现bookmarks以及跟jsf以外的部件能够通信,可以使用 <f:viewParam name=”param1″ value=”#{bean.prop1}”/> 来传递参数
  • 外部通过xxx.jsf?param1=”xxx”传入~~
  • 下面用就是直接#{bean.prop1}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s