使用 Primefaces FileUpload 和 jQuery Mobile p:fileupload 未呈现？答案

【问题标题】：Using Primefaces FileUpload with jQuery Mobile p:fileupload not rendered?使用 Primefaces FileUpload 和 jQuery Mobile p:fileupload 未呈现？
【发布时间】：2013-05-04 10:14:54
【问题描述】：

我的尝试：我想使用 jQuery mobile 在 JSF 页面中上传带有 Primefaces FileUpload 标记的图片。此面仅在桌面浏览器上可用，但也应具有与其他页面一样的外观。问题：总是当我从 jquery mobile 和脚本添加样式表时 - 整个表单不会被呈现/不可见。有人知道我该如何解决这个问题吗？

标题：

    <link rel="stylesheet" href="./jquery/jquery.mobile-1.3.1.min.css" />
    <script type="text/javascript" src="./jquery/jquery.js"></script>
    <script type="text/javascript" src="./jquery/jquery.mobile-1.3.1.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="apple-mobile-web-app-capable" content="yes"/>

来自 jQuery Mobile 的内容区域

        <div id="content" data-role="content">   
            <h:form enctype="multipart/form-data">
                <p:fileUpload fileUploadListener="#{fileUploadController.handleFileUpload}"
                              mode="advanced" 
                              update="messages"
                              sizeLimit="100000" 
                              allowTypes="/(\.|\/)(gif|jpe?g|png)$/" />

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

            </h:form>
        </div>

编辑：如果您有其他想法，我可以将图像作为文件上传到我的 JSF 控制器，这对我来说将是一个很好的解决方案。

【问题讨论】：

标签： java jsf jquery-mobile file-upload primefaces

【解决方案1】：

我找到了一个解决方案 - 不太好，但没关系.. 我使用带有 uploadForm.xhtml 的 iframe（其中带有来自 primefaces 的上传标签的普通表单是）作为源并在我的常规 upload.xhtml 页面中（使用 jquery 移动 CSS）。

<iframe src="./uploadForm.xhtml" width="100%" height="300" scrolling="auto" border="0" frameborder="0"></iframe>

所以它会同时显示 - jquery mobile things 和 primefaces 上传表单。它并不完美，但它适用于我的桌面应用程序。

【讨论】：