pを表示する方法：p：growl内のfileUpload invalidFileMessage

Question

私は<p:fileUpload>を使用していますが、これはPDFのみに限定されています。しかし、invalidFileMessageは<p:fileUpload>のコンポーネントを示しています。代わりに<p:growl>に表示するにはどうすればよいですか？ 「これは、テスト@」=

<p:messages id="test" autoUpdate="true" /> 

そして、ファイルアップロードの更新にし、あなたのメッセージは、pで表示されます：

<p:fileUpload allowTypes="/(\.|\/)(pdf)$/" 
       invalidFileMessage="File is Invalid. Only PDF files are allowed" /> 

Answer 1

まあのようなあなたのページの何かにメッセージタグを追加したメッセージを。うなずきの中で、同じように簡単に変更することができます。 primefacesで

ルックは、より多くの例

Answer 2

のためのショーケースPrimefacesショーケースの例を見て、これを見つけました。実際のページ：

<p:fileUpload fileUploadListener="#{fileUploadController.handleFileUpload}" 
       mode="advanced" 
       update="messages" 
       allowTypes="/(\.|\/)(pdf)$/"/> 

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

とファイルアップローダーコントローラクラス：たぶん

public void handleFileUpload(FileUploadEvent event) { 
    FacesMessage msg = new FacesMessage("Succesful", event.getFile().getFileName() + " is uploaded."); 
    FacesContext.getCurrentInstance().addMessage(null, msg); 
} 

何かがPrimefaces

でメッセージを表示する方法に心に留めておくために

Answer 3

このサーバー側を処理できません。ファイルの種類は、サーバー側でコードを打つことなく、クライアント側で検証されます。したがって、手動でFacesMessageを作成したり、明示的に<p:message(s)>を追加することを提案する提案は、考えにくく、テストされていません。

You should use jQuery. It solves everything.

fileupload.jsソースコードに基づいて、あなたの最善の策は、メッセージコンテナの架空showイベントをリッスンし、フォームの最後にメッセージコンテナを移動することです。

最初に$.show()を拡張して、実際にshowイベントをトリガーします。

(function($) { 
    var originalShowFunction = $.fn.show; 
    $.fn.show = function() { 
     this.trigger("show"); 
     return originalShowFunction.apply(this, arguments); 
    }; 
})(jQuery); 

はその後、単純にファイルアップロードメッセージが表示された後、一つ一つのメッセージを解析し、<p:growl> JSのAPIのrenderMessage()機能を使用する場合、基本的に実行showイベントにリスナーを作成します。以下の例では、同じページのどこかに<p:growl widgetVar="growl">があることを前提としています。

$(document).on("show", ".ui-fileupload-content>.ui-messages", function() { 
    $(this).children().hide().find("li").each(function(index, message) { 
     var $message = $(message); 
     PF("growl").renderMessage({ 
      summary: $(".ui-messages-error-summary", $message).text(), 
      detail: $(".ui-messages-error-detail", $message).text() 
     }); 
    }); 
});