0
我需要在我的應用程序中包含引導程序樣式文件上傳控件。文件附件將被存儲在一個名爲「附件」的富文本字段中的文檔中。使用Java保存字段。Xpages引導程序上傳控件
我看過下面列出的網站以及Oliver Busse做的一個網站，但我現在找不到他的鏈接。
我最終想要一個自定義控件。
我已經將bootstrapfileinput4文件夾添加到我的WebContent文件夾中。
當我運行下面的代碼XPAGE我得到一個錯誤。
XPAGE代碼：我已經使用
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
xmlns:xc="http://www.ibm.com/xsp/custom">
<xp:this.data>
<xp:dominoDocument var="document1" formName="Contact"></xp:dominoDocument>
</xp:this.data>
<xp:this.resources>
<xp:script src="/jQueryXSnippet.js" clientSide="true"></xp:script>
</xp:this.resources>
<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>
<xc:ccLayoutBootstrap>
<xp:this.facets>
<xp:panel xp:key="facetMiddle">
<xp:br></xp:br>
<div class="page-header">
<h1>
FileInput
<xp:span style="color:rgb(255,255,255)"></xp:span><small>Bootstrap FileInput Plugin</small>
</h1>
</div>
<xp:fileUpload id="fileUpload1"
value="#{document1.fileAttachment}">
<xp:this.attrs>
<xp:attr name="accept" value="image/*" />
</xp:this.attrs>
</xp:fileUpload>
<xp:br></xp:br>
<xp:fileDownload rows="30" id="fileDownload1"
displayLastModified="true" value="#{document1.fileAttachment}"
hideWhen="true" allowDelete="true">
</xp:fileDownload>
<xp:button value="Save Document" id="button1" 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:br></xp:br>
</xp:panel>
</xp:this.facets>
</xc:ccLayoutBootstrap>
</xp:view>
鏈接：
Bootstrap UI for XPages File Upload component
你確定bootstrapfileinput4/js/fileinput.js被加載嗎？檢查網絡屬性並確保它不返回404.您可能需要將包含nsf的文件夾和文件名的完整路徑添加到src標記。 –
每個，這是我原來的想法，但我檢查了鉻和fileinput.js和fileinput.css都加載。 –
您可以在頁面加載後在控制檯中手動運行$（'input [type = file]'）。fileinput（） –