如何在onchange上捕獲錯誤/驗證錯誤文件上傳

我正在使用passthrough將onchange傳遞給PF文件上傳組件。我想摺疊一個面板，並在用戶選擇文件時展開另一個面板。如何在onchange上捕獲錯誤/驗證錯誤文件上傳

我遇到的問題是我總是摺疊和擴大面板。如果發生錯誤，我不希望這樣做。而錯誤，我的意思是如果我添加一個不受支持的文件類型。如果我這樣做，將會顯示PF錯誤信息，但onchange中的內容也會被調用。

我嘗試使用了args但這不是工作passthrough ...

如何我可以檢查這些特定的錯誤和只執行有什麼onchange內如果沒有任何？或者我可以以某種方式捕捉它們？

<p:fileUpload disabled="#{userAccess.isDisabled()}" 
    id="documentUpload" 
    label="#{msg['components.fileUpload.chooseDocument']}" 
    uploadLabel="#{msg['components.fileUpload.uploadLabel']}" 
    cancelLabel="#{msg['components.fileUpload.cancelLabel']}" 
    invalidSizeMessage="#{nts['error.documentType.invalidFileSize']}" 
    invalidFileMessage="#{cc.attrs.invalidFileTypeMessage}" 
    fileUploadListener="#{cc.attrs.documentsHandler.handleFileUpload}" 
    mode="advanced" 
    dragDropSupport="true" 
    oncomplete="PF('#{clientId}_addPanel').collapse();" 
    update="#{cc.clientId}:displayPanel" 
    process="@this" 
    allowTypes="#{cc.attrs.allowedTypes}" 
    styleClass="#{cc.attrs.styleClass}" 
    sizeLimit="1000000" 
    pt:onchange="if (tagName == 'INPUT' &amp;&amp; #{!cc.attrs.isLogo}) { if (!!value) {PF('#{clientId}_addPanel').collapse(); PF('#{clientId}_editPanel').expand();} }"> 
    <f:attribute name="document" value="#{cc.attrs.documentsHandler.document}" /> 
</p:fileUpload>

更新：

我甚至試圖讓這裏的消息都像console.log($(PrimeFaces.escapeClientId('#{cc.clientId}:addPanel')).find('.ui-messages-error-summary'));

與這也沒有成功存儲類名的DOM元素，它不使用時，發現了什麼onchange方法，但之後通過在瀏覽器控制檯中手動運行上述語句來查找。好像onchange在PF修改標記之前被執行。或者至少不是所有的標記...

有什麼建議嗎？

來源

2017-07-25 Olar Andrei

所以，我正在回答我自己的問題。工作代碼如下所示：

<p:fileUpload disabled="#{userAccess.isDisabled()}" 
    id="documentUpload" 
    widgetVar="#{clientId}_documentUpload" 
    label="#{msg['components.fileUpload.chooseDocument']}" 
    uploadLabel="#{msg['components.fileUpload.uploadLabel']}" 
    cancelLabel="#{msg['components.fileUpload.cancelLabel']}" 
    invalidSizeMessage="#{nts['error.documentType.invalidFileSize']}" 
    invalidFileMessage="#{cc.attrs.invalidFileTypeMessage}" 
    fileUploadListener="#{cc.attrs.documentsHandler.handleFileUpload}" 
    mode="advanced" 
    dragDropSupport="true" 
    oncomplete="PF('#{clientId}_addPanel').collapse();" 
    update="#{cc.clientId}:displayPanel" 
    process="@this" 
    allowTypes="#{cc.attrs.allowedTypes}" 
    styleClass="#{cc.attrs.styleClass}" 
    sizeLimit="1000000" 
    pt:onchange="if(tagName == 'DIV' &amp;&amp; !!id &amp;&amp; #{!cc.attrs.isLogo}) { if(!!PF('#{clientId}_documentUpload').files.length) { PF('#{clientId}_addPanel').collapse(); PF('#{clientId}_editPanel').expand(); } }"> 
    <f:attribute name="document" value="#{cc.attrs.documentsHandler.document}" /> 
</p:fileUpload>

基本上我的變化是passthrough線，現在看起來是這樣的：

pt:onchange="if(tagName == 'DIV' &amp;&amp; !!id &amp;&amp; #{!cc.attrs.isLogo}) { if(!!PF('#{clientId}_documentUpload').files.length) { PF('#{clientId}_addPanel').collapse(); PF('#{clientId}_editPanel').expand(); } }"

它基本上過濾出只有它有一個id的DIV元素，因爲我看到該文件僅附加到DOM中的一個元素，並通過使用widgetvar和條件if(!!PF('#{clientId}_documentUpload').files.length)它基本上工作。

我不知道這是否是最好的或正確的方式來做到這一點，但正如我所說的，它完成了這項工作。

來源

2017-07-31 21:16:08

如何在onchange上捕獲錯誤/驗證錯誤文件上傳

回答

相關問題