Xpages-Setting Up the ViewScope from client-side javaScript (oncontextmenu) - xpages

Question

I have a Xpages in which I have repeat control, Now I have the list of documents from a view. Onclick on the row is setting the viewScope Array with the Unid.
I have done this actually for the purpose of selecting the document and to keep track that which document is selected, I am successfull in doing that but the main purpose was, I wanted to obtain the UNID on right-Click context menu.
Now, Also the right click event is providing me the UNID in one text field. I have obtained this by using "oncontextmenu" attribute in a div tag.
<div oncontextmenu="javascript:
var a = document.getElementById('#{id:inputText1}').value;
document.getElementById('#{id:inputText2}').value=a;
return false;">
There is "inputText1" in each row with the default value UNID of the perticular row.
In above code I am getting the UNID from "inputText1" and setting it up to the "inputText2", So on right click I am successfully getting the UNID of the clicked row.
In futher case I have an idea that I can do any operation by using that UNID but instead of setting the UNID to the "inputText2", I want to set this UNID to viewScope not in "inputText2".
Basically my overall issue is that I want to set UNID which I am getting on right-click(oncontextmenu) to viewScope not in any text field("inputText2") using above client-side java script.
example code:
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
xmlns:xe="http://www.ibm.com/xsp/coreex">
<xp:this.afterPageLoad><![CDATA[#{javascript:var myList = new java.util.ArrayList();
sessionScope.put("myList",myList);}]]></xp:this.afterPageLoad>
<xp:button value="Refresh" id="button3">
<xp:eventHandler event="onclick" submit="true"
refreshMode="partial" refreshId="repeat2">
</xp:eventHandler></xp:button>
<xp:repeat id="repeat2" rows="30" value="#{sessionScope.myList}"
var="listData">
<xp:text escape="true" id="computedField1">
<xp:this.value><![CDATA[#{javascript:listData+" , "}]]></xp:this.value>
</xp:text>
</xp:repeat>
<xp:inputText id="inputText2"></xp:inputText>
<xp:repeat id="repeat1" rows="30" var="rowData"
indexVar="repeatIndex" first="0" styleClass="abc">
<xp:this.value><![CDATA[#{javascript:var viewName = "Adressakten";
var v:NotesView = database.getView(viewName);
return v.getAllEntries();}]]></xp:this.value>
<xp:br></xp:br>
<div oncontextmenu="javascript:
var a = document.getElementById('#{id:inputText1}').value;
document.getElementById('#{id:inputText2}').value=a;
return false;">
<xp:inputHidden id="inputText1">
<xp:this.defaultValue><![CDATA[#{javascript:var doc:NotesDocument = rowData.getDocument();
return doc.getUniversalID();}]]></xp:this.defaultValue>
</xp:inputHidden>
<xp:div id="div1">
<xp:this.style><![CDATA[#{javascript:javascript:var keyCode = rowData.getDocument().getUniversalID();
var myArray = sessionScope.get("myList");
if(myArray.contains(keyCode))
return "border-color:rgb(192,192,192);border-style:solid;border-width:thin;height:42.0px;background-color:green;cursor:pointer;"
else
return "border-color:rgb(192,192,192);border-style:solid;border-width:thin;height:42.0px;background-color:rgb(255,255,128);cursor:pointer;"}]]></xp:this.style>
<xp:text escape="true" id="computedField2">
<xp:this.value><![CDATA[#{javascript:var doc:NotesDocument = rowData.getDocument();
return doc.getItemValueString('aTitel');}]]></xp:this.value>
</xp:text>
<br />
document Id:
<xp:text escape="true" id="computedField3">
<xp:this.value><![CDATA[#{javascript:var doc:NotesDocument = rowData.getDocument();
return doc.getUniversalID();}]]></xp:this.value>
</xp:text>
<xp:br></xp:br>
<xp:button value="Add" id="button1" rendered="false">
<xp:eventHandler event="onclick" submit="true"
refreshMode="partial" refreshId="computedField2">
<xp:this.action><![CDATA[#{javascript:var keyCode = rowData.getDocument().getUniversalID();
var myArray = sessionScope.get("myList");
if(!myArray.contains(keyCode)){
myArray.add(keyCode);
}}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:button value="Remove" id="button2" rendered="false">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:var keyCode = rowData.getDocument().getUniversalID();
var myArray = sessionScope.get("myList");
myArray.remove(keyCode)}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:var keyCode = rowData.getDocument().getUniversalID();
var myArray = sessionScope.get("myList");
if(!myArray.contains(keyCode)){
myArray.add(keyCode);
}
else{
myArray.remove(keyCode);
}}]]></xp:this.action>
</xp:eventHandler>
</xp:div></div>
<br />
</xp:repeat>
</xp:view>

Answer 1

It sounds like the JSON RPC Service from the Extension Library is what you need. That will allow you to run SSJS using a value passed from CSJS. It's covered on pages 351-3 of XPages Extension Library book and there may be examples in Extension Library Demo database.

Answer 2

I absolutely agree with the answer of Paul Stephen Withers, the best way to do this is using JSON RPC.
Here a JSON RPC working example:
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">
<xe:jsonRpcService id="jsonRpcService1" serviceName="rpcService">
<xe:this.methods>
<xe:remoteMethod name="setUniqueID" script="sessionScope.put('sessionScopeVarTest', unid);">
<xe:this.arguments>
<xe:remoteMethodArg name="unid" type="string"></xe:remoteMethodArg>
</xe:this.arguments>
</xe:remoteMethod>
</xe:this.methods>
</xe:jsonRpcService>
Show Value of "sessionScope.sessionScopeVarTest" ->
<xp:text escape="true" value="#{sessionScope.sessionScopeVarTest}" style="font-weight:bold">
</xp:text>
<br/>
<br/>
<xp:button id="btnTriggerRPC" value="Trigger RPC Method">
<xp:eventHandler event="onclick" submit="false">
<xp:this.script><![CDATA[rpcService.setUniqueID('13F51C65D8C257FCC1257ED000361786')]]></xp:this.script>
</xp:eventHandler>
</xp:button>
<xp:button id="btnRefresh" value="Refresh Page">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
</xp:eventHandler>
</xp:button>
</xp:view>