4

我不确定如何重置 primefaces 数据表,然后将数据重新加载到其中。

有任何想法吗?

在此处输入图像描述

一旦我点击“教师”或“House Leadership Team”,我就会发送一个 ajax 调用,然后我想完全重置数据表,然后重新加载数据。

以下是与两个面板相关的部分:

#{msgs.typeOfLeaderPunishment}
<f:ajax event="valueChange" listener="#{detentionForm.updateData()}" execute="typeOfLeader" render="typeOfPunishment studentTable">
    <p:selectOneMenu id="typeOfLeader" value="#{detentionForm.typeOfLeaderSelectedID}" style="width:400px" panelStyle="width:150px" effect="fade">
       <f:selectItems value="#{detentionForm.teacherTypes}" var="type" itemLabel="#{type.label}" itemValue="#{type.value}" />
    </p:selectOneMenu>
</f:ajax>

这部分涉及选择“House Leadership Team”或“Teacher”,这将触发更新数据表的 ajax 调用。

<p:dataTable id="studentTable" var="student" value="#{detentionForm.students}" paginator="true" rows="10" selection="#{detentionForm.studentSelected}" filterDelay="200" filteredValue="#{detentionForm.filteredStudents}" binding="#{detentionForm.studentTable}">  
      <f:facet name="header">  
           Students:   
      </f:facet>  
                    <p:column id="prefName" headerText="Preferred Name" sortBy="=#{student.prefName}" filterBy="#{student.prefName}" filterMatchMode="contains">  
                        #{student.prefName} 

                    </p:column>  
                    <p:column id="lastName" headerText="Last Name" sortBy="#{student.lastName}" filterBy="#{student.lastName}" filterMatchMode="contains">
                        #{student.lastName}
                    </p:column>
                    <p:column id="house" headerText="House" sortBy="#{student.house}">
                        #{student.house}
                    </p:column>
                    <p:column id="code" headerText="Student Code" sortBy="#{student.studentCode}" >
                        #{student.studentCode}
                    </p:column>
                    <p:column id="gender" headerText="Gender" sortBy="#{student.gender}">
                        #{student.gender}
                    </p:column>
                    <p:column id="formName" headerText="Form" sortBy="#{student.form}">
                        #{student.form}
                    </p:column>
                    <p:column id="yearLevel" headerText="Year Level" sortBy="#{student.yearLevel}">
                        #{student.yearLevel}
                    </p:column>
                </p:dataTable>  

这部分是数据表。

//ajax method called when user clicks on "House Leadership Team" or "Teacher" int the selectOneMenu tag
    public void updateData(){
        this.findStudents();


    }



    //populates the student list with student codes depending on what ledership was chosen (eg. HouseLeader -> import House students only)
    private void findStudents() {
        this.students.removeAll(this.students);
        int houseID =  this.findTeacherHouseID();
        PreparedStatement ps;
        Connection con;
        String sqlStudentsTeacher = "SELECT a.LastName, a.PrefName, a.Code, a.Gender, b.FormName, b.YearLevel, c.HouseName FROM detentioncentredb.tbl_students a, detentioncentredb.tbl_forms b, detentioncentredb.tbl_houses c WHERE a.Form = b.Id AND a.House = c.Id";
        String sqlStudentsHouseLeader = "SELECT a.LastName, a.PrefName, a.Code, a.Gender, b.FormName, b.YearLevel, c.HouseName FROM detentioncentredb.tbl_students a, detentioncentredb.tbl_forms b, detentioncentredb.tbl_houses c WHERE a.Form = b.Id AND a.House = c.Id AND a.House = ?";
        ResultSet rs;
        try {
            con = ds.getConnection();
            if(this.typeOfLeaderSelectedID == 1){
                ps = con.prepareStatement(sqlStudentsTeacher);
            }else{ //typeOfLeaderSelectedID must equal 2. >>>>>>>>>>>Make sure that makeDetention xhtml page has a specific filter and there must be a validator when the user selects a leadership ty.pe
                ps = con.prepareStatement(sqlStudentsHouseLeader);
                ps.setInt(1,houseID);
            }
            rs = ps.executeQuery();
            //Puts a row into a Student object and chucks into the student arraylist
            while(rs.next()){
                Student s = new Student();
                s.setForm(rs.getString("FormName"));
                s.setGender(rs.getString("Gender"));
                s.setHouse(rs.getString("HouseName"));
                s.setLastName(rs.getString("LastName"));
                s.setPrefName(rs.getString("PrefName"));
                s.setStudentCode(rs.getString("Code"));
                s.setYearLevel(rs.getString("YearLevel"));
                this.students.add(s);
            }
            rs.close();
            ps.close();
            con.close();
        } catch (SQLException ex) {
            Logger.getLogger(DetentionFormBean.class.getName()).log(Level.SEVERE, null, ex);
        }

    }


    private int findTeacherHouseID(){
        PreparedStatement ps;
        Connection con;
        String sqlTeacherHouseID = "SELECT House FROM detentioncentredb.tbl_teachers WHERE RegNumber = ?";
        ResultSet rs;
        int id = 0;
        try {
            con = ds.getConnection();
            ps = con.prepareStatement(sqlTeacherHouseID);
            ps.setInt(1, this.details.getUserName());
            rs = ps.executeQuery();
            while(rs.next()){
                id = rs.getInt("House");
            }
            rs.close();
            ps.close();
            con.close();
        } catch (SQLException ex) {
            Logger.getLogger(DetentionFormBean.class.getName()).log(Level.SEVERE, null, ex);
        }

        return id;
    }

这部分是后面 bean 的一部分,显示了调用的 ajax 方法以及该方法的作用。我不知道在 ajax 方法中添加什么来重置数据库,然后将数据加载回数据表中。

4

4 回答 4

8

问题是,尽管您正在调用托管 bean 方法,但您并没有告诉 jsf 数据表“更新”其内容。

这应该有帮助

<p:selectOneMenu id="typeOfLeader" value="#{detentionForm.typeOfLeaderSelectedID}">
    <f:selectItems value="#{detentionForm.teacherTypes}" var="type" itemLabel="#{type.label}" itemValue="#{type.value}" />
    <p:ajax event="change" update="studentTable" listener="#{detentionForm.updateData()}" />
</p:selectOneMenu>

这里重要的部分是update="studentTable",它告诉在完成 ajax 请求后,用 id studentTable 更新 jsf 组件。

PS1:这假设您的 selectOneMenu 和 datatable 是相同的形式;如果不是,则应将 update="studentTable" 替换为正确的路径。PS2:我建议您阅读有关 DAO 层的信息,以便您可以从托管 bean 中删除 findStudents 方法。

于 2013-04-03T11:05:56.877 回答
0

每当您使用 ajax 更改选择一个菜单时,您都在调用 updateData 方法。尝试重建您在 updateData 方法上显示的列表“学生”。

于 2013-04-03T14:33:32.500 回答
0

我对 primefaces 4 数据表有同样的问题。

  1. 我已将 j2ee 版本从 j2ee6 更改为 j2ee7。
  2. 我已经用 gf 4 从 3.1.2 final 更改了 glassfish 服务器
  3. 我已将 jsf 版本从 2.2 更改为 2.2.4,但没有任何变化(仍然不刷新)

感谢 Mehul Kaklotar,我在创建/编辑/删除数据库并刷新数据表后重建/调用 getList()。

备注:update=":yourform:yourdatatable"添加<p:commandbutton>

于 2013-11-26T10:36:01.490 回答
0

通过使用 PrimeFaces remoteCommand 调用 dataTable 的 AJAX/jQuery filter() 函数,我取得了成功:

<p:selectOneMenu id="typeOfLeader" value="#{detentionForm.typeOfLeaderSelectedID}"
             style="width:400px" panelStyle="width:150px" effect="fade"
             onchange="typeOfLeaderUpdate();">

<f:selectItems value="#{detentionForm.teacherTypes}" var="type" itemLabel="#{type.label}" itemValue="#{type.value}" />
<p:ajax event="change" oncomplete="typeOfLeaderUpdate();"/>

<p:remoteCommand id="typeOfLeaderRemoteCommandId" name="typeOfLeaderUpdate"
                 actionListener="#{detentionForm.updateData()}"
                 update="studentTable"
                 oncomplete="student.filter();"/>

于 2013-12-31T19:04:27.423 回答