成功驗證字段後阻止UI

我使用帶有Primefaces 5.3的JSF 2.2。我要創建將是這樣工作的一種形式：成功驗證字段後阻止UI

按下一個按鈕後：

如果所有必填字段填寫，網頁已被封鎖（由於數據發送到數據庫）只要數據被髮送。
如果其中一個必填字段未填寫，則該頁面不會被阻止。

你能告訴我該怎麼辦嗎？

這是一個XHTML頁面：

<!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:ui="http://java.sun.com/jsf/facelets" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:p="http://primefaces.org/ui" 
     xmlns:pm="http://primefaces.org/mobile" 
     xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"> 
    <h:head></h:head> 
    <h:body id="page"> 

     <f:metadata> 
      <f:viewAction action="#{loginController.start()}" /> 
     </f:metadata> 

     <p:growl id="messages" showDetail="true" /> 

     <h:form> 
      <p:panelGrid id="panel" columns="2" styleClass="ui-noborder" columnClasses="rightalign,leftalign">      
       <p:outputLabel for="databaseName" value="Database name:" /> 
       <p:inputText id="databaseName" required="true" value="#{userDatabase.name}" /> 
       <p:outputLabel for="databaseFile" value="File:" /> 
       <p:fileUpload id="databaseFile" required="true" fileLimit="1" update="file messages" fileUploadListener="#{dataController.handleFileUpload}" mode="advanced" dragDropSupport="true" sizeLimit="1000000000" uploadLabel="Upload" cancelLabel="Delete" allowTypes="/(\.|\/)(txt|binetflow)$/" />    
       <h:panelGroup /> 
       <h:outputText id="fileDescription" value="#{dataController.fileName}" />       
       <p:commandButton id="buttonSend" value="Send" update="messages" action="#{dataController.send()}" />       
      </p:panelGrid> 

      <p:blockUI block="page" trigger="buttonSend"> 
       Sending of the data...    
      </p:blockUI>    

     </h:form> 

    </h:body> 
</html>

這是一個CDI豆：

package com.system.controller; 

import java.io.Serializable; 
import java.util.logging.Logger; 

import javax.enterprise.context.RequestScoped; 
import javax.enterprise.inject.Produces; 
import javax.faces.application.FacesMessage; 
import javax.faces.context.FacesContext; 
import javax.faces.view.ViewScoped; 
import javax.inject.Inject; 
import javax.inject.Named; 

import org.primefaces.event.FileUploadEvent; 
import org.primefaces.model.UploadedFile; 

import com.system.model.UserDatabase; 
import com.system.service.DataService; 

@Named 
@ViewScoped 
public class DataController implements Serializable { 

    private static final long serialVersionUID = 1383572529241805730L; 

    public void handleFileUpload(FileUploadEvent event){ 
     uploadFile=event.getFile(); 

     FacesMessage message = new FacesMessage("Successful", event.getFile().getFileName() + " is uploaded."); 
     FacesContext.getCurrentInstance().addMessage(null, message);   
    } 

    public String getFileName(){ 

     if(uploadFile==null) return ""; 
     else return uploadFile.getFileName();    
    } 

    public void send(){ 

     if(uploadFile==null){ 

      FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "The file isn't uploaded", "You should upload a file")); 
     } 
     else{ 

      //Sending the data to the database... (tha page should be blocked) 

      try { 
       Thread.sleep(5000); 
      } catch (InterruptedException e) { 
       e.printStackTrace(); 
      } 

      //After successful of sending the data, the page should be unlocked. 

      FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "The data has been added.", ""));   
     } 
    } 

    @Named 
    @Produces 
    @RequestScoped 
    private UserDatabase userDatabase=new UserDatabase(); 

    @Inject 
    private DataService dataService; 

    @Inject 
    private Logger log; 

    private UploadedFile uploadFile; 
}

當然上面的代碼它的工作原理，但網頁已被封鎖，每次當我按下按鈕（即使這些字段沒有填寫）。我認爲我應該在p:blockUI組件中使用widgetVar而不是trigger，但我不知道該如何，也許我錯了。對我來說最好的辦法是，如果我可以阻止/解鎖CDI bean中的send方法的頁面，但我不知道是否可能，除此之外 - 這不是必需的。每種方式都會對我有所幫助。

來源

2016-03-19 Robert

更新最後我找到了解決辦法。這些都是我做的步驟：

我用trigger的widgetVar屬性istead在blockUI組件：

<p:blockUI block="page" widgetVar="widgetBlock"> 
    Sending of the data...   
</p:blockUI>

我在DataController豆創建了自己的驗證方法：

public boolean isValidation(){ 

    if(uploadFile==null || userTable.getName()==null || userTable.getName().trim().equals("")) return false; 
    else return true; 
}

我加了onstart（我打電話給我的驗證方法和I塊頁面，如果我得到true）和oncomplete（這裏我解開頁）屬性命令按鈕：

<p:commandButton id="buttonSend" value="Send" action="#{dataController.send()}" update="messages" 
       onstart="if(#{dataController.validation}){PF('widgetBlock').show()}" 
       oncomplete="PF('widgetBlock').hide()" />

我放的commandButton id在FileUpload組件的update屬性。除此之外，我刪除了從文件上傳的require屬性：

<p:fileUpload id="file" 
       fileLimit="1" 
       update="buttonSend fileDescription messages" 
       fileUploadListener="#{dataController.handleFileUpload}" 
       mode="advanced" dragDropSupport="true" sizeLimit="1000000000" 
       uploadLabel="Upload" cancelLabel="Delete" allowTypes="/(\.|\/)(txt|binetflow)$/" />    
<h:panelGroup />

我刪除了inputText組件的屬性require以及和添加<p:ajax>標籤（我刪除了這個屬性，因爲<p:ajax>標籤將不能與這工作屬性像我想，看我的帖子here）：
```
<p:inputText id="tableName" value="#{userTable.name}" > 
    <p:ajax event="keyup" update="buttonSend" />      
</p:inputText> 
```

最後我在移動從XHTML頁面中字段的驗證，我send方法豆：

public void send(){    

    boolean validation=true; 

    if(userTable.getName()==null || userTable.getName().trim().equals("")){ 

     FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "The name field isn't filled", "You should fill this field")); 

     validation=false; 
    } 

    if(uploadFile==null){ 

     FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "The file isn't uploaded", "You should upload a file")); 

     validation=false; 
    }  

    if(validation){ 

     //Sending the data to the database... (tha page is blocked) 

     try { 
      Thread.sleep(5000); 
     } catch (InterruptedException e) { 
      e.printStackTrace(); 
     } 

     //After successful of sending the data, the page is unlocked. 

     FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "The data has been added.", ""));   
    } 
}

來源

2016-03-23 20:59:27 Robert

您可以檢查驗證失敗，這樣

他們只是在渲染=「＃{} facesContext.validationFailed」你blockui，也當表單被提交

來源

2016-03-19 14:47:03

我試圖實現你的想法，但它不工作或我做錯了什麼。我爲blockUI組件添加了'id'和'rendered'。除此之外，我還在commandButton組件中將blockUI'id'添加到'update'屬性中。之後，blockUI組件根本不起作用。你有什麼想法，爲什麼？首先我注意到，當我在eclipse中使用內容輔助功能呈現=＃{}時，eclipse不會顯示任何facesContext對象。也許我忘了添加一些東西？ – Robert

內容協助不適用於表達式語言afaik 並且您是否放入內部「」？在你的評論中你沒有它們如果這不起作用，你可以嘗試給你的blockui添加一個小部件變量，並在你的commandbutton的onstart或onclick像if（＃{facesContext.validationFailed（）}）{widget。 hide（）;} –

當然我把'＃{}'放在我的代碼裏面。我在評論中忘了它。不幸的是，第二個想法也不起作用。在我看來，問題是'＃{facesContext.validationFailed（）}'。我檢查了返回值，並且在每種情況下我仍然得到'false'。你有什麼想法，爲什麼？ – Robert

成功驗證字段後阻止UI

回答

相關問題