0

我正在使用以下代码片段上传照片，使用 primefaces ：

<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
    <h:outputText value="PrimeFaces Single Upload"  />
    <h:form enctype="multipart/form-data">
        <p:fileUpload fileUploadListener="#{uploadPhotoHandler.handleFileUpload}" mode="advanced"
            update="messages" label="Choose a file" sizeLimit="5242880" allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
            invalidSizeMessage="The maximum file size allowed is 1 Megabyte !"
            invalidFileMessage="You are allowed to upload only images !" />
        <p:growl id="messages" showDetail="true" sticky="true" />

我将此组合添加到主页中，index.xhtml使用以下命令：<ui:include src="upload_img_form.xhtml" />。

主页看起来像：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
<h:head>
    <script type="text/javascript" src="js/jquery-1.9.1.js"></script>
    <script type="text/javascript" src="js/jquery-migrate-1.1.1.js"></script>
    <script type="text/javascript" src="js/jquery.ui.widget.js"></script>
    <script type="text/javascript" src="js/jquery.xdr-transport.js"></script>
    <script type="text/javascript" src="js/jquery.fileupload.js"></script>
    <script type="text/javascript" src="themes/jquery-ui-1.10.0.custom/js/jquery-ui-1.10.0.custom.min.js"></script>
    <link type="text/css" rel="stylesheet" href="themes/jquery-ui-1.10.0.custom/css/sunny/jquery-ui-1.10.0.custom.css" />
    <link type="text/css" rel="stylesheet" href="css/base.css" />
    <link type=" text/css" rel="stylesheet" href="css/styles.css" />
</h:head>
<h:body>
    <div id="container" class="container ">
        <ui:include src="upload_img_form.xhtml" />
    </div>
</h:body>
</html>

我有以下问题：

  • 进度条不起作用，
  • 取消按钮不起作用，最大的问题是 sizeLimit 不验证作为输入给出的文件。
  • 即使这不是自动上传，文件也是自动上传的，之前没有点击上传按钮。

问题与该部分 100% 相关，head因为如果我删除它，它就会起作用。虽然，它不适用于同一页面中的其他功能，所以我必须保留js文件和styles.

谢谢您的答复。

4

1 回答 1

1

摆脱手动包含的 jQuery。PrimeFaces 已经自动包含自己的副本。如果它们是不同的版本，只会发生冲突，导致各种颜色的JS相关问题。如果您在浏览器的开发人员工具集中检查了 JS 控制台，您会注意到它。

于 2013-02-19T12:41:00.583 回答