Question

我正在尝试使用<h:commandButton>下载一个大文件，我想提醒用户，下载操作需要几秒钟/几分钟才会显示他们等待＆＃39;模态的。

我的问题是，我可以使用按钮的onclick事件显示图像，但我不知道如何在操作完成时隐藏它（这时下载文件的对话框弹出窗口是示出）。

我的代码就像：

<h:form id="form">

    <h:commandButton value="Download" 
        action="#{bean.downloadFile()}"
        onclick="showModal('waitModal')"/>

        <div id="waitModal" class="modal fade" tabindex="-1"
            role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-body">
                        WAIT!
                    </div>
                </div>
            </div>
        </div>  

</h:form>

一个解决方案是在bean中使用一个标志并调用一个带有超时的javascript函数来检查标志的值并在下载完成后关闭模式但是它不是我正在寻找的for ...它应该更通用，因为我必须在几个地方应用它

我知道有一些类似的问题，但我找不到任何可以应用于我的问题的解决方案。

谢谢！

Answer 1

PrimeFaces用p:fileDownload解决了您的问题。如果您不想使用PrimeFaces，您至少可以了解它们是如何实现的。

PrimeFaces为响应设置一个cookie，表示下载已完成。在客户端，他们使用window interval function，在单击下载按钮时注册。此函数以特定间隔检查提到的cookie。如果设置了cookie，它将被重置，interval函数将被取消注册，并且将调用一个可用于关闭对话框的回调函数。

有关实现的详细信息，请参阅PrimeFaces中的monitorDownload方法＆＃39; core.js以及p:fileDownload的实施。

我认为它易于实施，您可以很好地重复使用它。我不认为还有另一个更好的解决方案，因为文件下载需要一个完整的页面请求（而不是ajax请求），所以你不能注册一个回调函数或类似的东西。

调用h：commandButton submit后关闭模式面板

1 个答案: