0

当我尝试从模式调用支持 bean 方法时，它仅在我第二次单击时调用该方法。我尝试使用“action=''”和“onclick=''”调用该方法。问题是，1）我必须单击两次才能调用该方法 2）当我在“oncomplete”上添加一个javascript函数时，模态窗口关闭，但没有调用该方法。第一次单击该按钮时，我收到警告：找不到资源 /userarea/true.xhtml。userarea 是我的 JSF 页面所在的文件夹。

    <?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:ui="http://java.sun.com/jsf/facelets"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:b="http://bootsfaces.net/ui"
          xmlns:p="http://primefaces.org/ui"
          xmlns:c="http://java.sun.com/jsp/jstl/core">

        <ui:composition template="../WEB-INF/templates/template-main.xhtml">
            <ui:define name="title">Team</ui:define>
            <ui:define name="content">
                <f:metadata>
                    <f:viewAction action="#{TeamBacking.currentUserIsMemberOfATeam()}" />
                    <f:viewAction action="#{TeamBacking.onPageLoad()}" />
                </f:metadata>
                    <b:row>
                        <b:column span="7">
                           <!--Rendered in case there is a team-->
                            <b:panel rendered="#{TeamBacking.currentUserIsMemberOfATeam()}" 
                                     title="Team" 
                                     collapsible="false">
                                <h1>#{TeamBacking.teamName}</h1>
                                <b:dataTable value="#{TeamBacking.team.students}"
                                             var="teamMember"
                                             id="team-members"
                                             styleClass="table table-striped table-bordered">
                                    <h:column>
                                        <f:facet name="header">
                                            <h:outputText value="Name" />
                                        </f:facet>
                                        <h:outputText value="#{teamMember.firstName} #{teamMember.lastName}" />
                                    </h:column>
                                    <h:column>
                                        <f:facet name="header">
                                            <h:outputText value="Benutzername" />
                                        </f:facet>
                                        <h:outputText value="#{teamMember.username}" />
                                    </h:column>
                                    <h:column>
                                        <f:facet name="header">
                                            <h:outputText value="Aktion" />
                                        </f:facet>       
                                        <h:form>
                                             <b:commandButton look="danger" 
                                                              size="small" 
                                                              value="Entfernen"                                                         
                                                              onclick="ajax:TeamBacking.setSelectedUser(teamMember);" 
                                                              oncomplete="javascript:$('.delete-user-pseudo').modal();return false;" 
                                                              update="delete-user-modal">

                                             </b:commandButton>                                         
                                        </h:form>                                                                                    
                                    </h:column>
                                </b:dataTable>
                                <h:outputText rendered="#{TeamBacking.team.project != null}" escape="false">
                                    <p>Projekt: #{TeamBacking.team.project.projectName}</p>
                                </h:outputText>
                            </b:panel>
                        </b:column> 
</b:row>    

     <b:modal id="delete-user-modal" 
                                 closable="true" 
                                 title="Teammitglied entfernen" 
                                 styleClass="delete-user-pseudo" >                        
                            <p>Folgenden Nutzer aus dem Team entfernen?</p>
                            <ul>
                                <li>Name: #{TeamBacking.selectedUser.firstName} #{TeamBacking.selectedUser.lastName}</li>
                                <li>Menutzername: #{TeamBacking.selectedUser.username}</li>
                            </ul>


                                <h:form id="delete-user-form">
                                    <b:commandButton look="warning" 
                                                     value="Abbrechen"
                                                     onclick="javascript:$('.delete-user-pseudo').modal('hide');return false;" />
                                    <b:commandButton look="danger" 
                                              value="Löschen"   
                                              onclick="ajax:TeamBacking.deleteSelectedUserFromTeam()" 
                                              oncomplete="javascript:$('.delete-user-pseudo').modal('hide');return false;"                                                                                     
                                              update="team-members" /> 
                                </h:form>                                                                                                                                       

                        </b:modal>


            </ui:define>
        </ui:composition>


    </html>

现在我还尝试删除模式，以便按钮位于“空白页面”内并一直呈现如下所示。按钮仍然仅在第二次单击时调用支持 bean 方法。任何想法可能是什么问题？

<b:row id="delete-user-modal" 

                             styleClass="delete-user-pseudo" >     
                 <b:column span="12">
                        <p>Folgenden Nutzer aus dem Team entfernen?</p>
                        <ul>
                            <li>Name: #{TeamBacking.selectedUser.firstName} #{TeamBacking.selectedUser.lastName}</li>
                            <li>Menutzername: #{TeamBacking.selectedUser.username}</li>
                        </ul>


                            <h:form id="delete-user-form">
                                <b:row>               
                                    <b:column span="4" />
                                    <b:column span="4">
                                        <b:commandButton look="warning"
                                                         value="Abbrechen"
                                                         styleClass="full-width"
                                                         iconAwesome="stop-circle"
                                                         onclick="javascript:$('.delete-user-pseudo').modal('hide');return false;" />
                                    </b:column>                                    
                                    <b:column span="4" >
                                          <b:commandButton look="danger"
                                                           value="Löschen"
                                                           onclick="ajax:TeamBacking.deleteSelectedUserFromTeam()"
                                                           update="team-members form-picklist"
                                                           styleClass="full-width"
                                                           iconAwesome="trash-o"/> 
                                    </b:column>
                                </b:row>                                                              
                            </h:form>                                                                                                                                       
                        </b:column>
                    </b:row>
4

2 回答 2

0

我未能重现您的错误。我建议您在下面尝试我的代码并报告。您的 XHTML 代码存在一些问题：bean 名称teamBacking通常以小写字母开头，而且我不确定full-width您的项目中是否存在 CSS 类。以防万一：你把它和 混淆了col-xs="full-width"吗？那是不同的东西，不会转化为 CSS 类。

也就是说，这是我的工作代码，它在第一次点击时调用后端方法。希望它可以帮助您找到差异并解决问题：

import java.io.Serializable;                                                                                     

import javax.faces.bean.ManagedBean;                                                                             
import javax.faces.bean.SessionScoped;                                                                           

@ManagedBean                                                                                                     
@SessionScoped                                                                                                   
public class TeamBacking implements Serializable                                                                 
{                                                                                                                
    private static final long serialVersionUID = 1L;                                                             

    public void deleteSelectedUserFromTeam() {                                                                   
        System.out.println("removed user");                                                                      
    }                                                                                                            
}

XHTML 文件：

<?xml version="1.0" encoding="UTF-8"?>                                                                           
<!DOCTYPE html>                                                                                                  
<html xmlns="http://www.w3.org/1999/xhtml"                                                                       
  xmlns:h="http://xmlns.jcp.org/jsf/html"                                                                        
  xmlns:p="http://primefaces.org/ui"                                                                             
  xmlns:b="http://bootsfaces.net/ui"                                                                             
  xmlns:f="http://xmlns.jcp.org/jsf/core">                                                                       
<h:head>                                                                                                         
</h:head>                                                                                                        
<h:body>                                                                                                         
  <h:form id="delete-user-form">                                                                                 
    <b:row>                                                                                                      
      <b:column span="4">                                                                                        
        <b:commandButton look="danger" value="Löschen"                                                           
          onclick="ajax:teamBacking.deleteSelectedUserFromTeam()"                                                
          update="@form" styleClass="full-width" iconAwesome="trash-o" />                                        
      </b:column>                                                                                                
    </b:row>                                                                                                     
  </h:form>                                                                                                      
</h:body>                                                                                                        
</html>
于 2016-05-31T20:26:21.260 回答
0

我在这篇文章中找到了这个错误的原因。ajax 渲染表单时，表单元素的视图状态似乎丢失了。为了在打开模式时获得新的视图状态，我必须明确更新表单。

于 2016-06-25T22:38:51.130 回答