JSF学习小结值radio,input

JSF第一章，常用的较难标签

        初学JSF会感到他强大的同时也会被它那复杂的标签所困惑，笔者就从自己的切身体会谈及我在JSF路上的尴尬与羞涩。

由于目前对JSF的相关书籍大都是偏于翻译，难免会有一些不到之处，但是唯有经历过，然后克服一个个问题，才能真正意义上掌握并熟练运用。无论是在html中还是jsp中，不管是ojnl还是jstl标签，最难搞的莫过于这么几种。

        第一种：下拉框。第二种：单选框。

        那么现在我就把我的需求说一下，领导指示页面要做成这种情况

     需求如上，只要是实现这么两种效果，需求二的效果很好实现，需求一的效果就太太容易实现了（针对新手来说）
     需求一，修改数据点击保存，不进行页面刷新，然后将数据提交到后台。
     需求二，改变是否，不刷新页面，提交数据到后台。

1、实现需求一：
      这个需要用到下面这个标签，顺便把属性说了
          前台页面：
        <rich:inplaceInput value="#{parseXmlAction.dataManagerTime}" showControls="true"       
                                controlsHorizontalPosition="right" controlsVerticalPosition="bottom"
                                id="inplaceInput1"
                                required="true" >
                                 //value:用于在前台显示的数据值
                                 //showControls="true" 属性用来控制是否显示 Save/Cancel 按钮
                                //定义绑定id
                                <f:facet name="controls">
                                    <button οnmοusedοwn="#{rich:component('inplaceInput1')}.save();"
                                        type="button" οnclick="updDataManagerTime();">Save</button>
                                    <button οnmοusedοwn="#{rich:component('inplaceInput1')}.cancel();"
                                        type="button">Cancel</button>
                                    
                                </f:facet>
                                <a4j:support event="onviewactivated" actionListener="#{parseXmlAction.updDataManagerTime}" reRender="inplaceInput1" ajaxSingle="true">
                              //event="onviewactivated",事件类型，比较常用。
                              //actionListener="#{parseXmlAction.updDataManagerTime}"    你发送后台的监听事件
                               //reRender="inplaceInput1"                 渲染的id
                               //ajaxSingle="true"                        将你修改之后的值传递给后台，如果这里不设置的话，后台接受到的永远是上一个值，我在后台没做处理
                                 直接用的这个属性
                               </a4j:support>
              </rich:inplaceInput>

          后台处理：

           public void updDataManagerTime(){

            System.out.println("修改信息dataManagerTime="+dataManagerTime);
        }

          简单介绍一下里面的常用属性，这个标签需要用到rich:inplaceInput标签，它需要有a4j控件的支持，才能往后台发送请求，响应你的后台action里面的方法。属性的简单说明：
           1)     defaultLabel属性，可以点击该属性以编辑控件的值；

           2)     对于控件值的修改只是在Browser上的行为，不会向Server传递任何数据；

           3)     showControls属性用来控制是否显示Save/Cancel按钮；

           4)     controlsHorizontalPosition和controlsVerticalPosition用来控制Save/Cancel的位置；

           5)     也可以使用自定义的控制器Control，只需要在体中加入一个<f:facet>，像这样：

            <rich:inplaceInputid="inputEmail" value="#{inplaceInputBean.email}"

                         defaultLabel="Clickto edit email" showControls="true"

                         controlsVerticalPosition="bottom"

                         controlsHorizontalPosition="left">

             <f:facetname="controls">

               <button   οnclick="#{rich:component('inputEmail')}.save();" type="button">

                           Save

                 </button>

              <button οnclick="#{rich:component('inputEmail')}.cancel();"type="button">

              Cancel

              </button>

                </f:facet>

             </rich:inplaceInput>

 

             6)      一旦自定义Control被启用，那么showControls属性也就隐式地被启用了。

             7)      控件也提供了一些特定事件给<a4j:support>的，当控件状态改变的时候，这些事件就会被调用来发送Ajax Request。

                  • oneditactivation：当激活edit状态的时候，会触发Ajax Request；

                  • oneditactivated：当控件变为edit状态后，会触发AjaxRequest；

                  • onviewactivation：当激活view状态的时候，会触发Ajax Request；

                  • onviewactivated：当控件状态变为view状态后，会触发Ajax Request（这个最常用）。

               大家看到我在a4j中使用的就是最后一个，修改完之后，点击保存，触发事件，将请求发送到后台。

2、实现需求二

其实这两中需求很像，用法都差不多。只不过提交到的action稍有不同，其他的也可以吧，但是没试过。

     前端实现

                              <h:outputText id="checkedBox1" value="#{console.whetherSaveOriginalData}" style="font-weight:bold;font-size:10px"></h:outputText>
                                 //value,显示后台值
                                <h:selectOneRadio  ajaxSingle="true" value="#{parseXmlAction.whetherSaveOriginalData}"  valueChangeListener="#  {parseXmlAction.updWhetherSaveOriginalData}">

                                    //valueChangeListener  往后台发送的事件
                                    <f:selectItem itemValue="true" itemLabel="是"/>
                                    <f:selectItem itemValue="false" itemLabel="否"/>
                                    <a4j:support event="onchange" reRender="checkedBox1" ></a4j:support> 

                                    //这里的事件使用的是event="onchange" 其实上面的那个和这个想过一样，都能起到这种作用
                                </h:selectOneRadio>

                    后台action中：

                       public void updWhetherSaveOriginalData(ValueChangeEvent evt){
                                //你页面所有的信息都在ValueChangeEvent里面，通常会根据evt来获取，如果你的前台信息跟需要的信息不一致，可以根据只发生改变还赋值，如下。

                                 //倘若值一样，你也可以根据我写的第一种来实现                           

                                  String changeType = evt.getNewValue().toString();

                                  if(changeType!=null&&!"".equals(changeType)){
                                  if(changeType.equals("false")){
                                  wifiAdmisstionAble=false;
                                    }else{
                                       wifiAdmisstionAble=true;
                           }
                            }
          
            ParseWifiLocationConfig.setWifiAdmisstionAble(wifiAdmisstionAble);
        }

                    

                  就写这么多吧，还在慢慢学习JSF，感觉这两个是这里面最难的。