我有一个隐藏的<p:fileUpload>
,它是通过<h:outputLabel>
打开的。
<p:messages id="message" autoUpdate="true" />
<h:form id="form">
<p:fileUpload id="file-input" auto="true"
allowTypes="/(\.|\/)(gif|jpe?g|png)$/" sizeLimit="10"
invalidSizeMessage="wrong size" fileUploadListener="#{bean.image}"
update="@form message" style="display: none;"
invalidFileMessage="wrong file" />
<h:outputLabel for="file-input_input">
<h:graphicImage name="images/dummy.jpg" />
</h:outputLabel>
<h:outputText value="#{bean.file.fileName}" />
<br />
<h:outputText value="#{bean.file.size}" />
</h:form>
不幸的是,验证失败后没有显示任何消息(例如无效的大小或无效的文件)。这些消息显示在<p:fileUpload>
内容框内,而不是<p:messages>
中。
如何在<p:messages>
内而不是<p:fileUpload>
内显示这些消息?
答案 0 :(得分:5)
验证在客户端完全执行,无需点击服务器。所以你无法从服务器端控制它。
<p:fileUpload>
的消息容器可通过widget变量的messageContainer
属性获得。简单的让jQuery在点击标签时将其移动到<p:messages>
:
<p:messages id="messages" ... />
<h:form>
<p:fileUpload id="file-input" widgetVar="file-input" ...
styleClass="ui-helper-hidden" />
...
<h:outputLabel for="file-input_input" ...
onclick="PF('file-input').messageContainer.appendTo($('#messages'));" />
</h:form>
(我只重命名<p:message id>
更合理,并使用PrimeFaces特定类来隐藏它而不是内联样式)
onstart
的{{1}}和oncomplete
属性不可用,因为它们仅在客户端验证通过且实际发送文件上载请求时执行。