小贝子编程

JSF AJAX命令按钮和表



我的菜单有问题。这将获取users数据库表中的users。

但是当我尝试在搜索栏中输入一个名字并点击搜索按钮时，什么也没有发生。我已经弄清楚了，它将第四次刷新整个页面，然后执行按钮操作并第五次刷新整个页面。

<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:h="http://java.sun.com/jsf/html"
            xmlns:f="http://java.sun.com/jsf/core"
            template="../../templates/default.xhtml">
<ui:define name="title">Any great stuff</ui:define>
<ui:define name="content">
    <div class="row container">
        <div class="small-12 columns">
            <h1>Any great stuff</h1>
            <div class="row">
                <div class="small-12 large-12 columns">
                    <section class="class">
                        <div class="row">
                            <h:form>
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:selectOneMenu id="actionDropdown" value="#{adminController.action}">
                                                <f:selectItem id="actionItem0" itemValue="0" itemLabel="Choose"/>
                                                <f:selectItem id="actionItem1" itemValue="1" itemLabel="Delete"/>
                                            </h:selectOneMenu>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandButton value="Übernehmen" class="button postfix" action="#{adminController.actionUser}" />
                                        </div>
                                    </div>
                                </div>
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:selectOneMenu  id="roleDropbown" value="#{adminController.role}">
                                                <f:selectItem id="roleItem0" itemValue="0" itemLabel="Choose item"/>
                                                <f:selectItem id="roleItem1" itemValue="1" itemLabel="Item2"/>
                                                <f:selectItem id="roleItem2" itemValue="2" itemLabel="Item3"/>
                                                <f:selectItem id="roleItem3" itemValue="3" itemLabel="Item4"/>
                                                <f:selectItem id="roleItem4" itemValue="4" itemLabel="Item5"/>
                                            </h:selectOneMenu>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandButton value="Wechseln" class="button postfix" action="#{adminController.changeRole}" />
                                        </div>
                                    </div>
                                </div>
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <input type="text" id="usersearch" value="#{adminController.searchvalue}" placeholder="Suchen..."/>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandButton id="usersearchButton" value="Suchen" class="button postfix" action="#{adminController.searchUser}">
                                                <f:ajax execute="@form" render="@none" />
                                            </h:commandButton>
                                        </div>
                                    </div>
                                </div>
                            </h:form>
                        </div>
                        <table>
                            <thead>
                            <tr>
                                <th width="5"><input onClick="selectAll(this)" type="checkbox"/></th>
                                <th></th>
                                <th>Number</th>
                                <th width="250">Name</th>
                                <th width="250">E-Mail</th>
                                <th width="150">Role</th>
                            </tr>
                            </thead>
                            <tbody>
                            <ui:repeat value="#{adminController.userList}" var="user">
                                <tr>
                                        <td><input type="checkbox" name="user[]" value=""/></td>

                                    <td><img src="#{user.picture}" alt="Picture"/></td>
                                    <td>#{user.registerNumber}</td>
                                    <td>#{user.name}</td>
                                    <td><a href="mailto:#{user.email}">#{user.email}</a></td>
                                    <td>#{user.role}</td>
                                </tr>
                            </ui:repeat>
                            </tbody>
                        </table>
                    </section>
                </div>
            </div>
        </div>
    </div>
    <script src="../../js/script.js"></script>
</ui:define>
</ui:composition>

My adminController.java使用

public List<User> getUserList()

来填充表值。这工作得很好，当我给searchvalue一个静态值，它也会工作。我必须在上面的xhtml中输入什么?(问题是，我对x/html和它的标签一无所知，所以请注意。)有人告诉我，我必须使用Panelgroup，但我不知道在哪里。(我已经重命名了itemvalues，这没什么你要关心的)

你的搜索按钮包含标签。所以当你点击按钮时，它不会提交页面。只是发送ajax请求。但呈现= @none。这意味着它不会更新表单。如果你像这样改变render=@form，它应该工作。

<div class="small-4 columns">
    <div class="row collapse">
        <div class="small-8 columns">
            <h:inputText id="usersearch" value="#{adminController.searchvalue}" />
        </div>
        <div class="small-4 columns">
            <h:commandButton id="usersearchButton" value="Suchen" styleClass="button postfix" action="#{adminController.searchUser}">
                <f:ajax execute="@form" render="@form" />
            </h:commandButton>
        </div>
    </div>
</div>

更新:

使用& lt; h: dataTable/比;代替

 <h:dataTable id="myDataTable" value="#{adminController.userList}" var="user">
        <h:column>
            <img src="#{user.picture}" alt="Picture"/>
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="Number"/>
            </f:facet>
            <h:outputText value="#{user.registerNumber}"/>
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="Name"/>
            </f:facet>
            <h:outputText value="#{user.name}"/>
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="Email"/>
            </f:facet>
            <h:outputLink value="mailto:#{user.email}">
                <h:outputText value="#{user.email}"/>
            </h:outputLink>
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="Role"/>
            </f:facet>
            <h:outputText value="#{user.role}"/>
        </h:column>
    </h:dataTable>

现在你只能更新你的表。

<f:ajax execute="@form" render="myDataTable" />

对不起，有一点更新:重新加载DataTable工作正常。这是我当前的xhtml:

<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:h="http://java.sun.com/jsf/html"
            xmlns:f="http://java.sun.com/jsf/core"
            xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
            template="../../templates/default.xhtml">
<ui:define name="title">Benutzerverwaltung</ui:define>
<ui:define name="content"
<ui:include src="../../partials/navigationbar.xhtml"/>
    <f:metadata>
        <f:event listener="#{adminController.openPage}" type="preRenderView" />
    </f:metadata>
    <div class="row container">
        <div class="small-12 columns">
            <h1><h:outputText value="Benutzerverwaltung"/></h1>
            <div class="row">
                <div class="small-12 large-12 columns">
                    <section class="class">
                        <h:form>
                            <div class="row">
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:commandButton id="refreshButton" value="Userliste neu laden" class="button postfix" action="#{adminController.reloadUsers}">
                                                <f:ajax execute="@form" render="myDataTable"/>
                                            </h:commandButton>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:selectOneMenu id="actionDropdown" value="#{adminController.action}">
                                                <f:selectItem id="actionItem0" itemValue="0" itemLabel="Aktion wählen..."/>
                                                <f:selectItem id="actionItem1" itemValue="1" itemLabel="Löschen"/>
                                            </h:selectOneMenu>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandLink value="Übernehmen" class="button postfix" actionListener="#{adminController.actionUser}">
                                                <f:ajax execute="@form" render="myDataTable" />
                                            </h:commandLink>
                                        </div>
                                    </div>
                                </div>
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:selectOneMenu  id="roleDropbown" value="#{adminController.role}">
                                                <f:selectItem id="roleItem0" itemValue="0" itemLabel="Rolle wählen..."/>
                                                <f:selectItem id="roleItem1" itemValue="1" itemLabel="Student"/>
                                                <f:selectItem id="roleItem2" itemValue="2" itemLabel="Tutor"/>
                                                <f:selectItem id="roleItem3" itemValue="3" itemLabel="Dozent"/>
                                                <f:selectItem id="roleItem4" itemValue="4" itemLabel="Admin"/>
                                            </h:selectOneMenu>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandButton value="Wechseln" class="button postfix" actionListener="#{adminController.changeRole}">
                                                <f:ajax execute="@form" render="myDataTable" />
                                            </h:commandButton>
                                        </div>
                                    </div>
                                </div>
                                <div class="small-4 columns">
                                    <div class="row collapse">
                                        <div class="small-8 columns">
                                            <h:inputText id="usersearch" value="#{adminController.searchvalue}" p:placeholder="Suchen..."/>
                                        </div>
                                        <div class="small-4 columns">
                                            <h:commandButton id="usersearchButton" value="Suchen" class="button postfix" action="#{adminController.searchUser}">
                                                <f:ajax execute="@form" render="myDataTable"/>
                                            </h:commandButton>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <h:dataTable id="myDataTable" value="#{adminController.userList}" var="user" binding="#{adminController.dataTable}">
                                <h:column>
                                        <f:facet name="header"><!-- CheckBox -->
                                            <h:selectBooleanCheckbox onclick="selectAll(this)" />
                                        </f:facet>
                                    <h:selectBooleanCheckbox value="#{user.select}"/>
                                </h:column>
                                <h:column>
                                    <img value-id="#{user.id}" src="#{user.picture}" alt="Picture"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header"><!-- Matrikelnummer -->
                                        <h:outputText value="Matrikelnummer"/>
                                    </f:facet>
                                    <h:outputText value="#{user.registerNumber}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header"><!-- Name -->
                                        <h:outputText value="Name"/>
                                    </f:facet>
                                    <h:outputText value="#{user.name}"/>
                                </h:column>
                                <h:column>
                                    <f:facet name="header"><!-- Email -->
                                        <h:outputText value="Email"/>
                                    </f:facet>
                                    <h:outputLink value="mailto:#{user.email}">
                                        <h:outputText value="#{user.email}"/>
                                    </h:outputLink>
                                </h:column>
                                <h:column>
                                    <f:facet name="header"><!-- Rolle -->
                                        <h:outputText value="Rolle"/>
                                    </f:facet>
                                    <h:outputText value="#{user.role}"/>
                                </h:column>
                            </h:dataTable>
                        </h:form>
                    </section>
                </div>
            </div>
        </div>
    </div>
 </ui:define>
 </ui:composition>

和AdminController:

import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.component.html.HtmlDataTable;
import javax.faces.event.ActionEvent;
import java.util.*;
@SessionScoped
@ManagedBean
public class AdminController {
private int action, role;
private String searchvalue, dbsearch;
private int userID;
private static Database db;
private HtmlDataTable dataTable = new HtmlDataTable();
/**
 * Fills the datatable
 *
 *
 */
public List<User> getUserList(){
    System.out.println("getUserList()");
    System.out.println("searchvalue:"+searchvalue);
    getwholeUsers();
    return db.get().getItems();
}

public void collectCheckboxes(){
    int anz = dataTable.getRowCount();
    for(int i = 0; i < anz; i++){
        dataTable.setRowIndex(i);
        User ts = (User) dataTable.getRowData();
        System.out.println(ts.getId() + " - "  + ts.isSelect());
    }
}
/**
 *
 * This method will be executed, when the page is opened or refreshed
 */
@PostConstruct
public void openPage(){
    System.out.println("openPage()");
    getwholeUsers();
}
/**
 * reloads the usertable with all users
 *
 *
 */
public void reloadUsers(){
    System.out.println("ReloadUsers()");
    getwholeUsers();
}
/**
 *
 * Grabs the whole users from database
 *
 **/
private void getwholeUsers(){
    db = Database.getInstance().prepare("SELECT * FROM users");
}
/**
 * Search the typed text in usersearch in database
 *
 *
 */
public void searchUser(){
    System.out.println("searchUser()");
   // searchvalue="Robert";
    dbsearch = "%"+searchvalue+"%";
    System.out.println("dbsearch:"+dbsearch);
    db = Database.getInstance().prepare("SELECT * FROM users WHERE name LIKE ? OR email LIKE ? OR registernumber LIKE ?");
    db.with(dbsearch); // name
    db.with(dbsearch); // email
    db.with(dbsearch); // registernumber
    System.out.println("Search success");
    db.get();
    System.out.println("Search db.get success");
}
/**
 * Makes an action on selected user, values got from the itemValue of actionDropwdown
 * 0 = do nothing
 * 1 = delete User
 *
 * 13 ACTION 1 collectCB openPage 4
 */
public void actionUser(ActionEvent event){
    System.out.println("action:"+action);
    collectCheckboxes();
    userID = 7;
    switch (action){
        case 0:
            Flash.setFlashMessage("error", "Bitte eine Aktion auswählen");
            break;
        case 1:
            db = Database.getInstance().prepare("DELETE FROM users WHERE id = ?");
            db.with(Integer.toString(userID)); // id
            db.run();
            break;
        default:
            break;
    }
}
/**
 * Sets the role ("type" in Database) on selected user, values got from the itemValue of roleDropdown
 * 0 = no nothing
 *
 * Recognize the type convention:
 * Student = 1
 * Tutor = 2
 * Dozent = 3
 * Admin = 4
 *
 *
 *
 *
 */
public void changeRole(ActionEvent event){
    collectCheckboxes();
    userID=8;
    if (role >= 1 && role <= 4){
        Database db = Database.getInstance().prepare("UPDATE users SET type = ? WHERE id = ?");
        db.with(Integer.toString(role));
        db.with(Integer.toString(userID));
        db.run();
    } else if (role == 0){
        Flash.setFlashMessage("error", "Bitte eine Rolle auswählen");
    } else {
        Flash.setFlashMessage("error", "Kein gültiger Wert");
    }
}


public void setAction(int action) {
    this.action = action;
}
public int getAction() {
    return action;
}
public void setRole(int role) {
    this.role = role;
}
public int getRole() {
    return role;
}
public void setSearchvalue(String searchvalue) {
    this.searchvalue = searchvalue;
}
public String getSearchvalue() {
    return searchvalue;
}
public void setDataTable(HtmlDataTable dataTable) {
    this.dataTable = dataTable;
}
public HtmlDataTable getDataTable() {
    return dataTable;
}
}

有人告诉我，我的servlet(我不知道)是错误的。点击我的按钮，它会重载9次用户列表，然后做这个动作，然后再重载5次。当我通过链接或第一次打开页面时，它执行两次我的openPage()(其中有@PostConstruct)。希望这对你有帮助。

另一个问题:如何正确地获取表中显示和检查的项目ID——在本例中是用户的ID。我将选择1个或多个复选框来执行roleChange或deleteUser)编辑:我更新了两个源代码。我找到了一个答案(http://www.java-forum.org/allgemeines-ee/56126-datatable-checkboxen.html)来阅读所选的复选框-但它们都是假的。我弄清楚了，(当我单击动作按钮时)它将执行getUserList() 13次，然后执行actionUser()一次，collectCheckboxes()一次，openPage()一次和getUserList() 4次。希望能帮到你。:/

相关内容

  • 没有找到相关文章

最新更新


热门标签：

javascript python java c# php android html jquery c++ css ios sql mysql arrays asp.net json python-3.x ruby-on-rails .net sql-server django objective-c excel regex ruby linux ajax iphone xml vba spring asp.net-mvc database wordpress string postgresql wpf windows xcode bash git oracle list vb.net multithreading eclipse algorithm macos powershell visual-studio image forms numpy scala function api selenium