`

JSF中使用BooleanCheckbox实现全选功能

    博客分类:
  • JSF
阅读更多

两种方案:

一、在entity bean中添加一个额外的字段,用于指示该实体bean是否被选中。

二、entity bean中的字段完全是和数据库中字段对应的,即没有额外的用于指示是否被选中的字段;是否被选中则在托管bean中用一个Map来反映。

具体实现看代码:(:该文基于网络上的一些资料而完成)

/page/下的jsp:

<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%--
The taglib directive below imports the JSTL library. If you uncomment it,
you must also add the JSTL library to the project. The Add Library... action
on Libraries node in Projects view can be used to add the JSTL 1.1 library.
--%>
<%--
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
--%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Test Checkbox</title>
        <script  language="javascript" type="">
        function SetCheckedStatus()
        {
            var oTable=document.getElementById('myform:dt');
            var oChkAll=document.getElementById('myform:dt:chkall');
            if(oTable != null && oChkAll != null)
            {
                for(j=1;j<oTable.rows.length;j++)
                {
                    oTable.rows[j].cells[0].childNodes[0].checked=oChkAll.checked;
                }
            }
        }
        </script>
        
    </head>
    <body>
        <f:view>
            <h:form id="myform">
                
                <h:dataTable id="dt" value="#{testManageBean.users}" var="usr" width="100%" border="1" cellpadding="0" cellspacing="0">
                    <h:column>
                        <f:facet name="header">
                            <h:selectBooleanCheckbox id="chkall" onclick="SetCheckedStatus();" value="#{testManageBean.chkall}"/>
                        </f:facet>
                        <h:selectBooleanCheckbox id="chkbox" value="#{usr.checked}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="headerText1" value="姓名"/>
                        </f:facet>
                        <h:outputText value="#{usr.name}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="headerText2" value="年龄"/>
                        </f:facet>
                        <h:outputText value="#{usr.age}"/>
                    </h:column>
                </h:dataTable>
                <h:commandButton id="showCheckedButton" action="#{testManageBean.showCheckedbox}" value="show checked users"/>
                <h:dataTable id="dts" value="#{testManageBean.checkedUsers}" var="usr" width="100%" 
                             rendered="#{testManageBean.showCheckedUsers}" border="1" cellpadding="0" cellspacing="0">
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="header1" value="姓名"/>
                        </f:facet>
                        <h:outputText value="#{usr.name}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="header2" value="年龄"/>
                        </f:facet>
                        <h:outputText value="#{usr.age}"/>
                    </h:column>
                </h:dataTable>
                
            </h:form>
        </f:view>
        
    </body>
</html>

 

 

<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%--
The taglib directive below imports the JSTL library. If you uncomment it,
you must also add the JSTL library to the project. The Add Library... action
on Libraries node in Projects view can be used to add the JSTL 1.1 library.
--%>
<%--
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
--%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Test Checkbox</title>
        <script  language="javascript" type="">
        function SetCheckedStatus()
        {
            var oTable=document.getElementById('myform:dt');
            var oChkAll=document.getElementById('myform:dt:chkall');
            if(oTable != null && oChkAll != null)
            {
                for(j=1;j<oTable.rows.length;j++)
                {
                    oTable.rows[j].cells[0].childNodes[0].checked=oChkAll.checked;
                }
            }
        }
        </script>
        
    </head>
    <body>
        <f:view>
            <h:form id="myform">
                
                <h:dataTable id="dt" value="#{testMapManageBean.users}" var="usr" width="100%" border="1" cellpadding="0" cellspacing="0">
                    <h:column>
                        <f:facet name="header">
                            <h:selectBooleanCheckbox id="chkall" onclick="SetCheckedStatus();" value="#{testMapManageBean.chkall}"/>
                        </f:facet>
                        <h:selectBooleanCheckbox id="chkbox" value="#{testMapManageBean.checkedIds[usr.id]}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="headerText1" value="姓名"/>
                        </f:facet>
                        <h:outputText value="#{usr.name}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="headerText2" value="年龄"/>
                        </f:facet>
                        <h:outputText value="#{usr.age}"/>
                    </h:column>
                </h:dataTable>
                <h:commandButton id="showCheckedButton" action="#{testMapManageBean.showCheckedbox}" value="show checked users"/>
                <h:dataTable id="dts" value="#{testMapManageBean.checkedUsers}" var="usr" width="100%" 
                             rendered="#{testMapManageBean.showCheckedUsers}" border="1" cellpadding="0" cellspacing="0">
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="header1" value="姓名"/>
                        </f:facet>
                        <h:outputText value="#{usr.name}"/>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText id="header2" value="年龄"/>
                        </f:facet>
                        <h:outputText value="#{usr.age}"/>
                    </h:column>
                </h:dataTable>
                
            </h:form>
        </f:view>
        
    </body>
</html>

 

package test.entitybean下的class:

 

 

package test.entitybean;

/**
 *
 * @author SailingLee
 */
public class TestEntityBean {
    
    private String name;
    private int age;
    private boolean checked;//额外的字段,在数据库中没有与之对应的字段,只用于判断该实体bean是否被选中
    
    /** Creates a new instance of TestEntityBean */
    public TestEntityBean() {
    }
    
    public TestEntityBean(String name,int age) {
        this.name = name;
        this.age = age;
    }

    public String getName() {
        return name;
    }

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

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public boolean isChecked() {
        return checked;
    }

    public void setChecked(boolean checked) {
        this.checked = checked;
    }
    
}

 

/*
 * TestPureEntityBean.java
 * 此实体bean中没有额外的用于判断是否被选中的字段
 */

package test.entitybean;

/**
 *
 * @author SailingLee
 */
public class TestPureEntityBean {
    
    private Integer id;
    private String name;
    private int age;
    
    /** Creates a new instance of TestPureEntityBean */
    public TestPureEntityBean() {
    }
    
    public TestPureEntityBean(int id,String name,int age) {
        this.id = new Integer(id);
        this.name = name;
        this.age = age;
    }

    public String getName() {
        return name;
    }

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

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    
}

 

package test.managebean下的class:

package test.managebean;
import java.util.List;
import java.util.ArrayList;
import test.entitybean.TestEntityBean;
import test.phase.PostbackPhaseListener;
/**
 *
 * @author SailingLee
 */
public class TestManageBean {
    private List users = null;
    private List checkedUsers = null;
    private boolean showCheckedUsers;

    private boolean chkall;
    /** Creates a new instance of TestManageBean */
    public TestManageBean() {
        //if(!PostbackPhaseListener.isPostback()){
            users = new ArrayList(5);
            TestEntityBean user = new TestEntityBean("sailinglee",25);
            users.add(user);
            user = new TestEntityBean("dyzhang",24);
            users.add(user);
            user = new TestEntityBean("elzhuang",25);
            users.add(user);
            user = new TestEntityBean("sdwang",26);
            users.add(user);
            user = new TestEntityBean("wfan",25);
            users.add(user);
        //}
    }
    
    public String showCheckedbox(){
        checkedUsers = new ArrayList(5);
        for(int i=0;i<users.size();i++){
            TestEntityBean user = (TestEntityBean)users.get(i);
            if(user.isChecked())
                checkedUsers.add(user);
        }
        if(checkedUsers.size()>0)
            this.setShowCheckedUsers(true);
        else
            this.setChkall(false);
        return "ok";
    }
    
    public List getUsers() {
        return users;
    }
    
    public void setUsers(List users) {
        this.users = users;
    }
    
    public List getCheckedUsers() {
        return checkedUsers;
    }
    
    public void setCheckedUsers(List checkedUsers) {
        this.checkedUsers = checkedUsers;
    }
    
    public boolean isShowCheckedUsers() {
        return showCheckedUsers;
    }
    
    public void setShowCheckedUsers(boolean showCheckedUsers) {
        this.showCheckedUsers = showCheckedUsers;
    }

    /**
     * @return the chkall
     */
    public boolean isChkall() {
        return chkall;
    }

    /**
     * @param chkall the chkall to set
     */
    public void setChkall(boolean chkall) {
        this.chkall = chkall;
    }
}

 

/*
 * TestMapManageBean.java
 *
 */

package test.managebean;
import java.util.List;
import java.util.ArrayList;
import java.util.Map;
import java.util.HashMap;
import test.entitybean.TestPureEntityBean;
import test.phase.PostbackPhaseListener;
/**
 *
 * @author SailingLee
 */
public class TestMapManageBean {
    
    private List<TestPureEntityBean> users = null;
    private List<TestPureEntityBean> checkedUsers = null;
    private Map<Integer,Boolean> checkedIds = new HashMap<Integer,Boolean>();
    private boolean showCheckedUsers;

    private boolean chkall;
    /** Creates a new instance of TestMapManageBean */
    public TestMapManageBean() {
        //if(!PostbackPhaseListener.isPostback()){
            users = new ArrayList<TestPureEntityBean>(5);
            TestPureEntityBean user = new TestPureEntityBean(1,"sailinglee",25);
            users.add(user);
            user = new TestPureEntityBean(2,"dyzhang",24);
            users.add(user);
            user = new TestPureEntityBean(3,"elzhuang",25);
            users.add(user);
            user = new TestPureEntityBean(4,"sdwang",26);
            users.add(user);
            user = new TestPureEntityBean(5,"wfan",25);
            users.add(user);
        //}
    }
    
    public String showCheckedbox(){
        checkedUsers = new ArrayList<TestPureEntityBean>(5);
        for(TestPureEntityBean user : users){
            if(this.checkedIds.get(user.getId()).booleanValue()){
                checkedUsers.add(user);
                //this.checkedIds.remove(user.getId());
            }
        }
        if(checkedUsers.size()>0)
            this.setShowCheckedUsers(true);
        else
            this.setChkall(false);
        return "ok";
    }
    
    public List getUsers() {
        return users;
    }
    
    public void setUsers(List users) {
        this.users = users;
    }
    
    public List getCheckedUsers() {
        return checkedUsers;
    }
    
    public void setCheckedUsers(List checkedUsers) {
        this.checkedUsers = checkedUsers;
    }
    
    public boolean isShowCheckedUsers() {
        return showCheckedUsers;
    }
    
    public void setShowCheckedUsers(boolean showCheckedUsers) {
        this.showCheckedUsers = showCheckedUsers;
    }
    
    public Map<Integer, Boolean> getCheckedIds() {
        return checkedIds;
    }
    
    public void setCheckedIds(Map<Integer, Boolean> checkedIds) {
        this.checkedIds = checkedIds;
    }

    /**
     * @return the chkall
     */
    public boolean isChkall() {
        return chkall;
    }

    /**
     * @param chkall the chkall to set
     */
    public void setChkall(boolean chkall) {
        this.chkall = chkall;
    }
    
}

 

/WEB-INF/下的faces-config.xml:

<?xml version='1.0' encoding='UTF-8'?>


<!DOCTYPE faces-config PUBLIC
  "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
  "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">

<!-- =========== FULL CONFIGURATION FILE ================================== -->

<faces-config>
    <managed-bean>
        <managed-bean-name>testManageBean</managed-bean-name>
        <managed-bean-class>test.managebean.TestManageBean</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
    <managed-bean>
        <managed-bean-name>testMapManageBean</managed-bean-name>
        <managed-bean-class>test.managebean.TestMapManageBean</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
    <lifecycle>
        <phase-listener>test.phase.PostbackPhaseListener</phase-listener>
    </lifecycle>
  
</faces-config>

 :实现过程中PostbackPhaseListener没有用好,该例子只是说明JSF中全选的实现,关键在于那段jsp里js,那里的[]不可写为(),否则在firefox中可能有脚本错误,原因很简单,[]对应的是数组,而()对应的是函数。

1
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics