2016-03-19 27 views
0

Ich benutze einen JSF 2.2 mit einem Primefaces 5.3. Ich muss ein Formular erstellen, die Arbeit wird so sein:Block UI nach erfolgreicher Feldverifizierung

Nach Knopfdruck:

  • Wenn alle erforderlichen Felder ausgefüllt sind, wird die Seite (durch das Senden von Daten an die Datenbank blockiert) solange die Daten gesendet werden.
  • Wenn eines der erforderlichen Felder nicht ausgefüllt ist, wird die Seite nicht blockiert.

Können Sie mir sagen, wie kann ich es tun?

Dies ist eine XHTML-Seite:

<!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> 

Dies ist ein CDI Bean:

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; 
} 

Natürlich ist die obige Code funktioniert es aber die Seite jedes Mal blockiert wird, wenn ich den Knopf drücken (auch wenn die Felder nicht ausgefüllt sind). Ich denke, ich sollte eine widgetVar anstelle einer trigger in einer p:blockUI Komponente verwenden, aber ich weiß nicht, wie und vielleicht irre ich mich. Der beste Weg für mich wäre, wenn ich die Seite von der send-Methode in der CDI-Bean blockieren/entsperren könnte, aber ich weiß nicht, ob es möglich ist und abgesehen davon - das ist nicht notwendig. Jeder Weg wird mir hilfreich sein.

Antwort

1

Schließlich vorgelegt wird, fand ich die Lösung . Dies sind Schritte, die ich getan habe:

  1. Ich benutzte das widgetVar Attribut istead des trigger in der BlockUI Komponente:

    <p:blockUI block="page" widgetVar="widgetBlock"> 
        Sending of the data...   
    </p:blockUI> 
    
  2. ich meine eigene Validierungsmethode erstellt in der DataController Bohne:

    public boolean isValidation(){ 
    
        if(uploadFile==null || userTable.getName()==null || userTable.getName().trim().equals("")) return false; 
        else return true; 
    } 
    
  3. Ich habe die onstart hinzugefügt (wo ich meine Validierungsmethode aufrufen und ich blockiere die Seite, wenn ich true) und die oncomplete erhalten (wo ich die Seite) Attribute für den Befehl entsperren:

    <p:commandButton id="buttonSend" value="Send" action="#{dataController.send()}" update="messages" 
           onstart="if(#{dataController.validation}){PF('widgetBlock').show()}" 
           oncomplete="PF('widgetBlock').hide()" /> 
    
  4. Ich habe command id zum update Attribute in der Fileupload-Komponente.Abgesehen davon, dass ich löschte das require Attribut aus dem Fileupload:

    <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 /> 
    
  5. ich das require Attribut input Komponente ebenfalls gelöscht und hinzugefügt, um den <p:ajax>-Tag (Ich löschte dieses Attribut, weil der <p:ajax> Tag nicht mit diesem funktionieren würde Attribut wie ich will, auf meinem Posten aussehen here):

    <p:inputText id="tableName" value="#{userTable.name}" > 
        <p:ajax event="keyup" update="buttonSend" />      
    </p:inputText> 
    
  6. am Ende zog ich die Validierung der Felder aus der xhtml Seite meiner send Methode in DataController Bohne:

    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.", ""));   
        } 
    } 
    
0

Sie überprüfen können, ob die Validierung wie diese

scheiterte nur gerendert attach = „# {facesContext.validationFailed}“, um Ihre BlockUI und es auch aktualisieren, wenn das Formular

+0

Ich habe versucht, Ihre Idee umzusetzen, aber es funktioniert nicht oder ich habe etwas falsch gemacht. Ich fügte "id" und "gerendert" für blockUI Komponente hinzu. Abgesehen davon habe ich blockUI 'id' hinzugefügt, um das Attribut 'update' in der commandButton-Komponente ebenfalls zu aktualisieren. Danach funktioniert die blockUI-Komponente überhaupt nicht. Hast du eine Ahnung warum? Zuerst bemerkte ich, dass die Eclipse mir kein facesContext-Objekt zeigte, wenn ich einen Inhaltsassistenten in Eclipse für rendered = # {} verwendete. Vielleicht habe ich vergessen, etwas hinzuzufügen? – Robert

+1

Inhalt unterstützen funktioniert nicht für Ausdruck Sprache afaik und haben Sie in ""? in Ihrem Kommentar haben Sie es ohne sie wenn das nicht funktioniert, könnten Sie versuchen, Hinzufügen eines Widget var zu Ihrem Blockui und im Onstart oder onclick Ihrer Befehlsschaltfläche etwas wie if (# {facesContext.validationFailed()}) {Widget. hide();} –

+0

Natürlich habe ich '# {}' in "" in meinen Code eingefügt. Ich habe es im Kommentar vergessen. Leider funktioniert die zweite Idee auch nicht. Das Problem ist meiner Meinung nach '# {facesContext.validationFailed()}'. Ich habe den Rückgabewert überprüft und jeweils "falsch" bekommen. Hast du eine Ahnung warum? – Robert

Verwandte Themen