Xpages：如何将 Bootstrapped Xpage FileUploadControl 与支持的 Java 类集成

Question

我有一个很好的 Bootstrapped 文件控件。

我从 Web 获得的这个文件控件绑定到一个文档数据源。我的文档由一个 java bean 支持，我正在使用 ObjectDataSource 将该 bean 绑定到 Xpage。

但是，我不知道如何将附件字段绑定到文件上传控件。

Xpage中相关代码如下：

//Data Object

    <xp:this.data>
        <xe:objectData
            saveObject="#{javascript://BuildTaskMaster.save()}" var="task">
            <xe:this.createObject><![CDATA[#{javascript:var task = new com.scoular.model.Task();
var unid = sessionScope.get("unid");
if (unid != null) {
    task.loadByUnid(unid);
} else {
    task.create();
}
return task;}]]></xe:this.createObject>
        </xe:objectData>
    </xp:this.data>

//Bootstraped File Uploaded     

<script type="text/javascript" src="bootstrapfileinput4/js/fileinput.js"></script>
<link rel="stylesheet" href="bootstrapfileinput4/css/fileinput.css" media="all" type="text/css" />
<xp:scriptBlock id="scriptBlockInitFile">
<xp:this.value>
<![CDATA[
$(document).ready(
function() {
$('input[type=file]').fileinput({
previewFileType: "image",
browseClass: "btn btn-primary",
browseLabel: "Browse",
browseIcon: '<i class="glyphicon glyphicon-plus"></i>',
removeClass: "btn btn-danger",
removeLabel: "Delete",
removeIcon: '<i class="glyphicon glyphicon-trash"></i>',
uploadClass: "btn btn-info",
uploadLabel: "Upload",
uploadIcon: '<i class="glyphicon glyphicon-upload"></i>',
});
}
);
]]>
</xp:this.value>
</xp:scriptBlock>

    <xp:fileUpload id="fileUpload2" value="#{task.attachments}">
        <xp:this.attrs>
            <xp:attr name="accept" value="*" />
        </xp:this.attrs>
    </xp:fileUpload>
    <xp:br></xp:br>
<xp:fileDownload rows="30" id="fileDownload1"
displayLastModified="true" value="#{task.attachments}"
hideWhen="true" allowDelete="true">
</xp:fileDownload>    
<xp:button value="Save Document" id="button3" styleClass="btn btn-primary">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
<xp:actionGroup>
<xp:saveDocument></xp:saveDocument>
<xp:openPage name="/BootstrapFileInput4.xsp"></xp:openPage>
</xp:actionGroup>
</xp:this.action>
</xp:eventHandler>
</xp:button>

    </xp:panel>

    <xp:eventHandler event="onClientLoad" submit="true"
                refreshMode="norefresh">
                <xp:this.action><![CDATA[#{javascript:try {
dojo.byId("#{id:inputText1}").focus();
} 
catch(e)
{}}]]></xp:this.action>
            </xp:eventHandler>  

    <xp:scriptBlock id="scriptBlock1" loaded="false">
        <xp:this.value><![CDATA[$(document).ready(
function() {
$('input[type=file]').fileinput({
previewFileType: "image",
browseClass: "btn btn-primary",
browseLabel: "Browse",
browseIcon: '<i class="glyphicon glyphicon-plus"></i>',
removeClass: "btn btn-danger",
removeLabel: "Delete",
removeIcon: '<i class="glyphicon glyphicon-trash"></i>',
uploadClass: "btn btn-info",
uploadLabel: "Upload",
uploadIcon: '<i class="glyphicon glyphicon-upload"></i>'
});
}
);]]></xp:this.value>
    </xp:scriptBlock>

Java类的相关部分

public class Task implements Serializable {
    private static final long serialVersionUID = 1L;

    // Common Fields
    private String unid;
    private Boolean newNote;
    private DateTime crtDte;
    private String crtUsr;

    // Custom Fields
    private Number order;
    private String title;
    private String notes;
    private UploadedFile attachments;

    //In save method

            if (attachments != null ) {

                //get the uploaded file
                IUploadedFile attachment = attachments.getUploadedFile();

                //get the server file (with a cryptic filename)
                File serverFile = attachment.getServerFile();        

                //get the original filename
                String fileName = attachment.getClientFileName();    

                File correctedFile = new File( serverFile.getParentFile().getAbsolutePath() + File.separator + fileName );

                //rename the file to its original name
                boolean success = serverFile.renameTo(correctedFile);

                if (success) {
                    //do whatever you want here with correctedFile

                    //example of how to embed it in a document:
                    RichTextItem rtFiles = doc.createRichTextItem("attachments");
                    rtFiles.embedObject(lotus.domino.EmbeddedObject.EMBED_ATTACHMENT, "", correctedFile.getAbsolutePath(), null);
                    doc.save();

                    //if we're done: rename it back to the original filename, so it gets cleaned up by the server
                    correctedFile.renameTo(attachment.getServerFile() );
                }
            }




        public UploadedFile getAttachments() {
        return attachments;
    }
    public void setFileUpload( UploadedFile to) {
        this.attachments = to;
    }

我希望用户能够选择多个附件，而不是一次选择一个。

Answer 1

当我实现这个时，我使用这个代码作为基础 https://openntf.org/XSnippets.nsf/snippet.xsp?id=custom-xpage-file-upload-handler

还有PLUpload control

而且您不能在同一页面上上传所有内容，您需要第二个页面来检索附件，您可以在保存时将它们添加到文档中。