xp:scriptBlock 内にある #{id:divTrash} というシンタックスはXPagesファイル内でなければ正常に動作しません。
サンプルのコードを見るとざっと以下のシンタックスがCSJSに埋め込まれていました。
#{id:divTrash}
#{id:trashIcon}
#{id:ehDeleteDocs}
#{id:dataTable}
CSJSをライブラリ化する場合、これらのシンタックスをXPages側でグローバル変数として一度格納してやるなどすれば、希望どおりの実装が可能です。
以下、例になります。
----------------------------------------------------------------------------------------------------------------
<xp:scriptBlock>
<xp:this.value><![CDATA[var divTrashId = "#{id:divTrash}";
var trashIconId = "#{id:trashIcon}";
var ehDeleteDocsId = "#{id:ehDeleteDocs}";
var dataTableId = "#{id:dataTable}";
]]></xp:this.value>
</xp:scriptBlock>
----------------------------------------------------------------------------------------------------------------
CSJS側、
----------------------------------------------------------------------------------------------------------------
XSP.addOnLoad(init);
var divTrash;
function init() {
console.log("init");
divTrash = new dojo.dnd.Target(divTrashId);
dojo.connect(divTrash, "onDndDrop", targetDrop); // Connect the onDndDrop event to target
}
function targetDrop(source, nodes, copy, target) {
console.log("targetDrop");
..... 省略....
var propsEnlarge = {
width: {start: "80", end: "94", unit: "px"},
height: {start: "80", end: "94", unit: "px"}
};
dojo.anim(trashIconId, propsShrink, 250);
dojo.anim(trashIconId, propsEnlarge, 250);
// Get all the note IDs and put them in an array
var notesIDs = new Array();
dojo.forEach(nodes, function (node, i) {
notesIDs.push(dojo.attr(node, "noteid"));
});
XSP.executeOnServer(ehDeleteDocsId, // Event handler to be executed
dataTableId, // Data table to be partially refreshed
{}, // onStart, onError and onComplete events
notesIDs.join(",") // Value to be submitted so that SSJS code can process it
);
}
XSP.executeOnServer = function () {
..... 省略....
}