如何在操作完成之前隱藏按鈕？ Primefaces

我目前有一個文件上傳系統，目前我有一個按鈕讓用戶進入下一頁，但即使用戶沒有上傳任何內容，這也是可見的，如果用戶按下這個鍵，危險就在這裏上傳任何東西之前它會拋出一個錯誤，看起來不好，所以我想要做的就是隱藏這個按鈕，直到文件上傳成功實現，任何想法如何？如何在操作完成之前隱藏按鈕？ Primefaces

<p:fileUpload widgetVar="upload" fileUploadListener="#{fileUploadController.handleFileUpload}" 
            mode="advanced" 
            multiple="false" 
            update="messages" 
            label="Select File" 
            sizeLimit="100000000" 
            allowTypes="/(\.|\/)(gif|jpe?g|png|doc|docx|txt|pdf|html)$/" 
            auto="true"/> 
        <!-- selected auto="true" this has been selected to prevent user error as was discovered 
        when testing, some users pressed the upload button and wondered why nothing worked instead of 
        select file, now this stops this --> 


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

        Please press the button below once you have uploaded the file, to continue 


        <p:commandButton action="#{navigationBean.naviagtion}" value="Next" ajax="False"/>

行動的命令按鈕旁邊是一個我想禁用，直到文件上傳完畢

編輯：

<p:commandButton action="#{navigationBean.naviagtion}" value="Next" ajax="False" disabled="#{!fileUploadController.UploadComplete}"/>

是我的命令按鈕，它指向的fileUploadContoller，這是文件上傳發生的地方等，

問題是當我運行應用程序，我總是在頁面加載時得到一個實時按鈕

我添加了一個布爾到我fileUploadController：

public void handleFileUpload(FileUploadEvent event) { 
     //System.out.println("DesintationPDF : " + destinationPDF); 
     System.out.println("called handle file"); 
     System.out.println("Destination is : " + configProp.getProperty("destination")); 

     FacesMessage msg = new FacesMessage("Succesful", event.getFile().getFileName() + " is uploaded."); //Displays to user on the webpage 
     FacesContext.getCurrentInstance().addMessage(null, msg); 


     try { 
      copyFile(event.getFile().getFileName(), event.getFile().getInputstream()); 
     } catch (IOException e) { 
//handle the exception 
      e.printStackTrace(); 
     } 

    } 

    public boolean isUploadComplete() { 
     return uploadComplete; 
    } 

    public void setUploadComplete(boolean uploadComplete) { 
     this.uploadComplete = uploadComplete; 
    }

，但仍然得到錯誤

編輯2：

 <p:commandButton action="#{navigationBean.naviagtion}" value="Next" disabled="#{!fileUploadController.uploadComplete}"/>

控制檯

INFO: Upload complete value before copy file false 
INFO: upload complete value is : true

所以它是將該值更改爲true

但不改變按鈕生存

來源

2013-02-17 user2065929

什麼有關禁用按鈕，啓用它，當上傳完成？似乎比突然渲染更直觀。我也建議你使用PrimeFaces，因爲它很棒。（但這只是一個額外的東西） – Zhedar 2013-02-17 16:05:15

這將是一個完美的解決方案，我目前使用primefaces來創建fileupload和按鈕也是primefaces，我將如何去禁用和重新啓用它？將發佈我當前設置的代碼 – user2065929 2013-02-17 16:08:33

'＃{navigationBean.naviagtion}「'有可能是一個輸入錯誤 – Zhedar 2013-02-17 16:11:42

要禁用按鈕，直到上傳完成後，只是disabled屬性綁定到一個bean的屬性。在我看來，禁用似乎比突然渲染更直觀。用戶也會知道背景中正在發生某些事情。

<p:commandButton action="#{navigationBean.naviagtion}" value="Next" disabled="#{bean.disable}" ajax="False"/>

由於您使用PrimeFaces，此解決方案是最簡單的。只需將bean替換爲您的bean的名稱即可。

編輯：

public class YourNavigationBean { 

    private boolean uploadComplete; // <--- that's the property 

    // ... your bean content, like constructors and stuff.. 
    // ... 

    //a setter and a getter is needed, to here they are 
    public boolean isUploadComplete() { 
     return uploadComplete; 
    } 
    public void setUploadComplete(boolean uploadComplete) { 
     this.uploadComplete = uploadComplete; 
    } 
}

來源

2013-02-17 16:18:01 Zhedar

謝謝，我如何將禁用屬性綁定到正在完成文件上傳的bean？ – user2065929 2013-02-17 16:23:41

只需在'navigationBean'中添加另一個'boolean'屬性，例如將其命名爲'uploadComplete'。上傳完成時將其設置爲「true」。在你的按鈕，然後將是：'disabled =「＃{！navigationBean.uploadComplete}」' – Zhedar 2013-02-17 16:27:35

對不起，我是新來的，你是什麼意思添加另一個布爾屬性，你有一個例子嗎？ – user2065929 2013-02-17 16:31:42

使下一個按鈕不可見。在成功上傳文件後，在開始時保持標誌= false，使標誌爲真。或在文件上傳結束時使下一個按鈕可見爲true;

來源

2013-02-17 16:09:07 dvrnaidu

謝謝，我會如何去做這件事？ – user2065929 2013-02-17 16:10:53

ON上傳完成事件集顯示=塊。

HTML

<form action="#" method="post"> 
    <input type="file" name="fileInput" id="fileInput" /> 
    <input type="submit" id="submitbutton" value="submit" style="display:none" /> 
</form> 
<div id="result"></div>

的Javascript：

$(document).ready(
    function(){ 
     $('input:file').change(
      function(){ 
       if ($(this).val()) { 
        document.getElementById("submitbutton").style.display='block'; 
       } 
      } 
      ); 
    });

現場演示：http://jsfiddle.net/E42XA/205/

來源

2013-02-17 16:16:51

如何在操作完成之前隱藏按鈕？ Primefaces

回答

相關問題