Question

我在数据表格式之外有一个按钮，其中的功能是删除所选行，但问题是它在支持bean中返回该行的空值，正确完成了对growl消息的更新并执行了操作被召唤。然而，当把按钮放在表单中时，它工作正常，但我需要它在工具栏之外的工具栏中。

这是我的xhtml代码：

<ui:define name="content">
		
		
		<div class="row" >
		<p:toolbar id="tb">		
			 
			  <f:facet name="left">
		        <p:inputText style="margin-right:10px" placeholder="Rechercher..." />
		        <p:commandButton icon="fa fa-search" />
		    </f:facet>
		    <f:facet name="right">
		      <p:commandButton onclick="PF('analyseForm').show();" icon="fa fa-plus" />
			  <p:commandButton icon="fa fa-file-pdf-o" />
			  <p:commandButton process="@this,:form:anaDT" update=":form"  action="#{personel.removeSelectedAnalyse}"  icon="fa fa-trash-o" /> 
<!-- this button does the update and runs the action but returns a null value of the selected row-->
		    </f:facet>		
		    
		</p:toolbar>
	 	</div>
	 	
	 	
	 	<div class="row" >
					 		<h:form id="form">	
					 			<p:growl id="msgs" />				 		
					 			<p:dataTable style="font-size:12px;" id="anaDT" scrollable="true" scrollWidth="100%" var="ana" value="#{personel.analyses}" paginator="true" selectionMode="single" selection="#{personel.selectedAnalyse}" paginatorPosition="bottom" rowKey="#{ana.idAnalyse}" rows="10">
					 			
                
                <!-- columns here -->
                
                
								     <f:facet name="footer">
<!-- this button works fine -->
							            <p:commandButton class="btn btn-default" process="form:anaDT" update="form" ajax="true" icon="fa fa-trash-o" action="#{personel.removeSelectedAnalyse}"  /> 
							        </f:facet>
					 			</p:dataTable>
					 		</h:form>
		
	 	</div>
 
		<p:sticky target=":tb" margin="50" />
	</ui:define>

</ui:composition>

Answer 1

我已将rowKey更改为实体类型，为表单指定唯一ID。无需在p:commandButton点击处理表单。我将此按钮放入<h:form>。命令组件必须始终存在。在行单击时完成实体选择。当您单击按钮时，它将使用预设实体从List中删除。只需重新渲染<p:dataTable>即可。然后我将控制器移到javax.faces.view.ViewScope。 PrimeFaces组件默认使用ajax，因此控制器必须至少与视图一样宽。

小脸：

?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
  <h:head>
    <title>Facelet Title</title>
  </h:head>
  <h:body>
    <div class="row" >
      <h:form id="toolbarForm">
        <p:toolbar id="tb">     
          <f:facet name="left">
            <p:commandButton value="Delete selected User" process="@this" update="myForm" actionListener="#{myBean.deleteUser}"/> 
          </f:facet>        
        </p:toolbar>
      </h:form>
    </div>    

    <h:form id="myForm">
      <p:dataTable id="usersTable" value="#{myBean.users}" var="user" selectionMode="single" selection="#{myBean.selectedUser}" rowKey="#{user}">
        <p:column>
        <f:facet name="header">ID</f:facet>
        #{user.id}
        </p:column>
        <p:column>
        <f:facet name="header">First name</f:facet>
        #{user.firstName}
        </p:column>
        <p:column>
        <f:facet name="header">Last name</f:facet>
        #{user.lastName}
        </p:column>
      </p:dataTable>
    </h:form>
  </h:body>
</html>

控制器：

package x;

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.inject.Named;
import javax.faces.view.ViewScoped;
import lombok.Data;

@Data
@Named( value = "myBean" )
@ViewScoped
public class MyBean implements Serializable
{
  private List<User> users;
  private User selectedUser;

  public MyBean()
  {
    users = new ArrayList<>();
    users.add( new User( 1, "First1", "Last1" ) );
    users.add( new User( 2, "First2", "Last2" ) );
    users.add( new User( 3, "First3", "Last3" ) );
    users.add( new User( 4, "First4", "Last4" ) );
    users.add( new User( 5, "First5", "Last5" ) );
  }

  @PostConstruct
  public void init()
  {
    System.out.println( "MyBean.init() called" );
  }

    public void deleteUser()
   {
     if ( selectedUser == null )
       System.out.println( "Selected User is null" );
     else
       System.out.println( "The ID of the User to remove: " + Integer.toString( selectedUser.getId() ) );
    boolean bn = users.remove( selectedUser );
  }


}

用户类：

package x;

import lombok.Data;

@Data
public class User
{
  private int id;
  private String firstName;
  private String lastName;

  public User( int id_, String firstName_, String lastName_ )
  {
    id = id_;
    firstName =  firstName_;
    lastName = lastName_;
  }

}

源包含lombok注释以避免样板编码（getter / setter方法）

Answer 2

表单外的命令按钮不能用于提交表单。如果你想实现你想要的功能，一种方法是

在表单中有一个p：remoteCommand并将其绑定到支持bean方法personel.removeSelectedAnalyse并具有update =“@ form”
使用onclick属性从工具栏的命令按钮调用remoteCommand，remoteCommand提交表单。现在，支持bean将从表单中获取提交的值，以便您可以执行必要的处理，并在Ajax请求完成后更新表单。

远程命令展示：https://www.primefaces.org/showcase/ui/ajax/remoteCommand.xhtml

从表单外部处理数据表

2 个答案: