using viewscope for repeat var does not update viewscope outside the repeat - xpages

This gets me every time.
I want to edit the viewScope components and then use the results elsewhere - but in this simple example the computed field does not update .... what is the best way to do this?
Thanks
<xp:this.beforePageLoad><![CDATA[#{javascript:viewScope.Test = [];
viewScope.Test.push("Hello");
viewScope.Test.push("Go");
viewScope.Test.push("Hello1");}]]></xp:this.beforePageLoad>
<xp:repeat id="repeat1" rows="30" value="#{viewScope.Test}"
var="row" indexVar="i">
<xp:inputText id="inputText1" value="#{row}">
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="computedField1"></xp:eventHandler>
</xp:inputText>
</xp:repeat>
This is new data
<xp:text escape="true" id="computedField1"
value="#{viewScope.Test}">
</xp:text>

Fixed it by changing the value of inputText to "#{viewScope.Test[i]}"
<xp:this.beforePageLoad><![CDATA[#{javascript:
viewScope.Test = ["Test","Test1","Test2"];
}]]></xp:this.beforePageLoad>
<xp:repeat id="repeat1" rows="30" value="#{viewScope.Test}"
var="row" indexVar="i">
<xp:inputText id="inputText2" value="#{viewScope.Test[i]}">
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="computedField1">
</xp:eventHandler></xp:inputText>
</xp:repeat>
<xp:br></xp:br>This is new data
<xp:text escape="true" id="computedField1" value="#{viewScope.Test}"></xp:text>

Related

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

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>
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.
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>

Use XSP.partialRefreshPost function in XPages Extension Library dialog

In a xe:dialog (XPages Extension Library dialog), I want to use XSP.partialRefreshPost function, but when refreshing the entered values are lost.
The following example demonstrate the problem.
ComboBox1, inputText1, ComboBox2, inputText2 : OK but not in a xe:dialog
ComboBox3, inputText3 : OK but not use XSP.partialRefreshPost
ComboBox4, inputText4 : NOK because it uses XSP.partialRefreshPost function in xe:dialog
I try to change the properties xe:dialog without success.
How to use XSP.partialRefreshPost in a xe:dialog to have refresh OK ?
Thanks
<?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:label id="label1" value="refresh partial"></xp:label>
<xp:comboBox id="comboBox1">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
</xp:selectItems>
<xp:eventHandler event="onchange" submit="true" refreshMode="partial"refreshId="comboBox1">
</xp:eventHandler>
</xp:comboBox>
<xp:inputText id="inputText1">
<xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="inputText1">
</xp:eventHandler>
</xp:inputText>
<xp:br></xp:br>
<xp:label id="label2" value="refresh XSP.partialRefreshPost"></xp:label>
<xp:comboBox id="comboBox2">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
</xp:selectItems>
<xp:eventHandler event="onchange" submit="false">
<xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:comboBox2}", {immediate: true});]]></xp:this.script>
</xp:eventHandler>
</xp:comboBox>
<xp:inputText id="inputText2">
<xp:eventHandler event="onchange" submit="false">
<xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:inputText2}", {immediate: true});]]></xp:this.script>
</xp:eventHandler>
</xp:inputText>
<xp:br></xp:br>
<xe:dialog id="dialog1" partialRefresh="true">
<xp:label id="label3" value="refresh partial"></xp:label>
<xp:comboBox id="comboBox3">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
</xp:selectItems>
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="comboBox3">
</xp:eventHandler>
</xp:comboBox>
<xp:inputText id="inputText3">
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="inputText3">
</xp:eventHandler>
</xp:inputText>
<xp:br></xp:br>
<xp:label id="label4" value="refresh XSP.partialRefreshPost"></xp:label>
<xp:comboBox id="comboBox4">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
</xp:selectItems>
<xp:eventHandler event="onchange" submit="false">
<xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:comboBox4}", {immediate: true});]]></xp:this.script>
</xp:eventHandler>
</xp:comboBox>
<xp:inputText id="inputText4">
<xp:eventHandler event="onchange" submit="false">
<xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:inputText4}", {immediate: true});]]></xp:this.script>
</xp:eventHandler>
</xp:inputText>
</xe:dialog>
<xp:button id="button1" value="dialog">
<xp:eventHandler event="onclick" submit="false">
<xp:this.script><![CDATA[XSP.openDialog('#{id:dialog1}');]]></xp:this.script>
</xp:eventHandler>
</xp:button>
</xp:view>
partialRefreshPost doesn't work as expected in <xe:dialog>, e.g., when you choose a value in a combobox then partialRefreshPost sends the selected value on change event to server but server's response contains the old value and combobox value jumps back to old value. Even binding the field to data like a scope variable doesn't help.
But there is a workaround. Add parameter execId to partialRefreshPost:
XSP.partialRefreshPost("#{id:comboBox4}",
{execId: "#{id:comboBox4}", immediate: true})
Specify the element which you want to refresh, in this case the same (comboBox4). This way it will work as expected - like outside of a dialog box.

How to Save Values in Documents Edited In-line On Repeat Control

I have a repeat control on an xPage with a text field displayed directly in edit mode. When a user changes the value in the field, I need them to be able to either:
Select an icon directly beside the field to save the value in the document.
Make changes to this field in more than one document and click a button to save all of these changes to the appropriate documents saved simultaneously.
What I have so far is a method of capturing the unids of the documents whose editable field has been updated.
I cannot get either of these saves to work. I have listed below the portion of the code that controls these areas.
Here's the save all and sessionScope information
<xp:panel id="InlineEditContainer" xp:key="facetMiddle" style="width:100%">
<xp:this.data>
<xp:dominoView var="view1" viewName="vwMetricsByAssigned">
<xp:this.postOpenView><![CDATA[#{javascript:var myList = new java.util.ArrayList();
sessionScope.put("myList", myList);}]]></xp:this.postOpenView></xp:dominoView>
</xp:this.data>
<xp:button value="Submit All" id="button1">
<xp:eventHandler event= <"onclick" submit="true" refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:// Getting list of unids from docs which have been updated, and saving those docs
var db:NotesDatabase
if(sessionScope.myList == null){
return;
}else{
for (var s in sessionScope.myList){
var doc:NotesDocument = (db ? db.getDocumentByUNID(s) : database.getDocumentByUNID(s));
if (doc && doc.isValid()) {
doc.save();
}
}
}}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:br></xp:br>
<xp:repeat id="repeat1" rows="30" value="#{sessionScope.myList}" var="listData">
<xp:text escape="true" id="computedField6"><xp:this.value><![CDATA[#{javascript:listData + " , "}]]></xp:this.value></xp:text></xp:repeat>
<xp:br></xp:br>
Here's all the repeat data
<xp:repeat id="repeat2" rows="20" var="FColl" indexVar="idx" value="#{javascript:view1}">
<xp:panel id="InlineEditContainer2">
<xp:this.data>
<xp:dominoDocument var="document1" formName="frmMetricData" action="editDocument" documentId="# {javascript:FColl.getNoteID();}" >
</xp:dominoDocument>
</xp:this.data>
<xp:tr>
<xp:td id="td1">
<xp:text escape="true" id="computedField3">
<xp:this.value> <![CDATA[#javascript:FColl.getDocument().getItemValueString("BusinessUnit")}]]>
</xp:this.value>
</xp:text>
</xp:td>
<xp:td id="td2">
<xp:link escape="true" id="link1" value="/MetricData.xsp">
<xp:this.text><![CDATA[#{javascript:FColl.getDocument().getItemValueString("MetricName")}]]> </xp:this.text>
<xp:eventHandler event="onclick" submit="true" refreshMode="norefresh" immediate="true">
<xp:this.action>
<xp:openPage name="/MetricData.xsp" target="editDocument" documentId="#{javascript:return FColl.getNoteID();}" />
</xp:this.action></xp:eventHandler>
</xp:link>
</xp:td>
<xp:td id="td3">
<xp:inputText id="EditBox3" value="#{document1.Actual}" tabindex="1">
<xp:this.defaultValue><![CDATA[# {javascript:FColl.getDocument().getItemValueString("Actual")}]]></xp:this.defaultValue>
<xp:this.converter>
<xp:convertNumber type="number" integerOnly="true" />
</xp:this.converter>
<xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="repeat1">
<xp:this.action><![CDATA[#{javascript:// get the universalID of the document
var keyCode = FColl.getDocument().getUniversalID();
// Create an Array
var myArray = sessionScope.get("myList");
//If it's not already in the Array then add it.
if (!myArray.contains(keyCode)) {
myArray.add(keyCode);
}}]]></xp:this.action>
</xp:eventHandler></xp:inputText>
<xp:span>
<xp:image url="/.ibmxspres/domino/oneuiv2/images/iconConfirmation16.png" id="image1">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
<xp:saveDocument var="document1" />
</xp:this.action>
</xp:eventHandler>
</xp:image>
</xp:span>
If anybody can give me any ideas to try, I would be very grateful.
Make it simple! There is a simple action "save". Comes in save and save all flavors. The later goes below the repeat and saves any changed document.

Getting values from repeat control

I have a field inside a repeat control. Right now am using a viewScope in the onChange event to capture the field values inside the repeat control. Each time the field has to partial refreshes in order to get the value set in the scope variable.
The problem here is when the users set the focus outside the repeat control, the focus is not set until the partial refresh of the field is completed. Sometimes this partial refresh is too slow when user is accessing a remote domino server. Is there a effective way to capture the values inside the repeat control when the form is submitted?
The idea is to create fields dynamically when user click on the add button. The problem happen when you move the focus from the field inside the repeat control to the field outside the repeat control. The focus is not set, until the partial refresh of field inside the repeat control is completed. You may not occur this scenario, if the server is running locally on your machine. The below code shows the usage of repeat control to create fields dynamically
<xp:button value="Add Objects" id="addNavObj">
<xp:eventHandler event="onclick" submit="true"
refreshId="objLine" refreshMode="partial" id="eventHandler24">
<xp:this.action><![CDATA[#{javascript:viewScope.rowItems=viewScope.rowItems+1;getComponent("navObjRep").setValue(parseInt(viewScope.rowItems));}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:repeat rows="30" var="rowData" indexVar="rowIndex"
repeatControls="false" first="0" value="#{javascript:viewScope.rowItems}"
id="navObjRep" style="width:800.0px">
<xp:panel style="width:800.0px" id="objLine">
<xp:table style="width:800.0px">
<xp:tr>
<xp:td style="width:245.0px">
<xp:inputText id="objType" style="width:130.0px">
<xp:typeAhead mode="full" minChars="1" ignoreCase="true"
id="typeAhead4" rendered="false">
</xp:typeAhead>
</xp:inputText>
</xp:td>
<xp:td style="width:46.0px">
<xp:inputText id="objCode">
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="objCode" id="eventHandler3">
<xp:this.action><![CDATA[#{javascript:viewScope['objCode'+rowIndex] = getComponent("objCode").getValue()}]]></xp:this.action>
</xp:eventHandler>
</xp:inputText>
</xp:td>
<xp:td style="width:300.0px">
<xp:inputTextarea id="objDesc" style="height:40.0px;width:200.0px">
<xp:eventHandler event="onclick" submit="false" id="eventHandler40"></xp:eventHandler>
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="objDesc" id="eventHandler4">
<xp:this.action><![CDATA[#{javascript:viewScope['objDesc'+rowIndex] = getComponent("objDesc").getValue()}]]></xp:this.action>
</xp:eventHandler>
</xp:inputTextarea>
</xp:td>
</xp:tr>
</xp:table>
</xp:panel>
</xp:repeat>
Don't use the onChange event of an edit box for a partial refresh - you create an experience night mare. Excercise 23 has all you need.
Its just a simple, example for a repeat control with a variable number of input and computed Fields.Hope it helps you to solve your problem.
<xp:this.beforePageLoad><![CDATA[#{javascript:var languages:java.util.Vector = #Explode("de,en,pl",",");
viewScope.put("allLanguages",languages);
viewScope.put("selectedLanguages", languages)}]]>
</xp:this.beforePageLoad>
<xp:checkBoxGroup id="checkBoxGroup1" value="#{viewScope.selectedLanguages}">
<xp:this.defaultValue><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.defaultValue>
<xp:eventHandler event="onchange" submit="true" refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:// full update //partial update}]]></xp:this.action>
</xp:eventHandler>
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.value>
</xp:selectItems>
</xp:checkBoxGroup>
<xp:repeat id="repeat1" rows="30" var="varcollection" repeatControls="true">
<xp:this.value><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.value>
<xp:span>
<xp:this.rendered><![CDATA[#{javascript:var vec:java.util.Vector = viewScope.get( "selectedLanguages" );
return #IsMember(varcollection,vec);
}]]></xp:this.rendered>
<xp:label id="label1">
<xp:this.value><![CDATA[#{javascript:return varcollection + ": ";}]]></xp:this.value>
</xp:label>
<xp:inputText id="inputText1" loaded="true">
<xp:this.value><![CDATA[${javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';}]]></xp:this.value>
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="computedField1">
</xp:eventHandler></xp:inputText>
  <xp:text escape="true" id="computedField4"><xp:this.value><![CDATA[#{javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';}]]></xp:this.value></xp:text>  
<xp:text escape="true" id="computedField1">
<xp:this.value><![CDATA[${javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';
}]]></xp:this.value>
</xp:text>
<xp:br></xp:br>
</xp:span>
</xp:repeat> <xp:br></xp:br>
<xp:button value="Submit" id="button1">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true"></xp:eventHandler></xp:button>
<xp:br></xp:br>
<xp:br></xp:br>
<xp:text escape="true" id="computedField3"><xp:this.value><![CDATA[#{javascript:return "value1 = " +viewScope["Help_de"] +
"value2 = " +viewScope["Help_en"] +
"value3 = " +viewScope["Help_pl"]}]]></xp:this.value></xp:text>
The last computet field: computetdField3 will get the values 'onSubmit' and the others onChange.
I strugled for a few hours with about the same problem.
I have a repeat build up from different views and even do some consolidation on the result to show a nice input matrix of 3 field per row.
I want to create new documents for every line that has fields filled in in the repeat.
Partial refresh is indeed a nightmare.
Finaly I ended up with client side script onfocus and onChange events to add my data into a hidden field on the page. I concatenate the 3 fields per row and put them in the hidden field seperated by a §.
When pressing the submit button I just get server side the value of that hidden field, #Explode("§") it and run trough the newly created array and create documents from them.

Nested repeat controls in XPages

I have a situation where I have a set of nested repeat controls. What I would like to do is be able to refresh only selected parts of the repeat controls after dismissing a dialog box. I can specify the element to be refreshed as a parameter in the hide method of a dialog box like so:
dialog1.hide("repeat1");
where dialog1 is the component name of the dialog box and repeat1 is the component name of the repeat control to be refreshed.
If I refresh the top level, then all subordinate levels are refreshed. If I refresh the second level then only the first occurrence of the level 2 repeat control is refreshed. Likewise, if I refresh the third level, then only the first occurrence of the third level is refreshed.
There seems to be no obvious way to refresh, say, only the second level repeat controls or the third level repeat controls. Does anyone understand this behavior?
<?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:br></xp:br>
<xp:panel id="panel1">
<xp:button value="Label" id="button3">
<xp:eventHandler event="onclick" submit="true"
refreshMode="partial" refreshId="dialog1">
<xp:this.action><![CDATA[#{javascript:getComponent("dialog1").show();}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:br></xp:br>
<xp:text escape="true" id="computedField4" value="#{javascript:#Now()}">
<xp:this.converter>
<xp:convertDateTime type="both"></xp:convertDateTime>
</xp:this.converter>
</xp:text>
<xp:repeat id="repeat1" rows="30" var="rowdata" style="border:1px solid red"
repeatControls="true" removeRepeat="true">
<xp:this.value><![CDATA[#{javascript:[1, 2, 3]}]]></xp:this.value>
<xp:text escape="true" id="computedField1" value="#{javascript:rowdata}">
<xp:this.converter>
<xp:convertNumber type="number" integerOnly="true">
</xp:convertNumber>
</xp:this.converter>
</xp:text>
 - 
<xp:text escape="true" id="computedField7" value="#{javascript:#Now()}">
<xp:this.converter>
<xp:convertDateTime type="both"></xp:convertDateTime>
</xp:this.converter>
</xp:text>
<xp:br></xp:br>
<xp:repeat id="repeat2" rows="30" var="rowdata"
style="margin:1em; border:1px solid green" repeatControls="true"
removeRepeat="true">
<xp:this.value><![CDATA[#{javascript:["a", "b", "c"]}]]></xp:this.value>
<xp:text escape="true" id="computedField2" value="#{javascript:rowdata}">
<xp:this.converter>
<xp:convertNumber type="number" integerOnly="true">
</xp:convertNumber>
</xp:this.converter>
</xp:text>
 - 
<xp:text escape="true" id="computedField5" value="#{javascript:#Now()}">
<xp:this.converter>
<xp:convertDateTime type="both"></xp:convertDateTime>
</xp:this.converter>
</xp:text>
<xp:br></xp:br>
<xp:repeat id="repeat3" rows="30" var="rowdata"
style="margin:1em; border:1px solid orange" repeatControls="true"
removeRepeat="true">
<xp:this.value><![CDATA[#{javascript:[1, 2, 3]}]]></xp:this.value>
<xp:text escape="true" id="computedField3" value="#{javascript:rowdata}">
<xp:this.converter>
<xp:convertNumber type="number" integerOnly="true">
</xp:convertNumber>
</xp:this.converter>
</xp:text>
 - 
<xp:text escape="true" id="computedField6" value="#{javascript:#Now()}">
<xp:this.converter>
<xp:convertDateTime type="both"></xp:convertDateTime>
</xp:this.converter>
</xp:text>
<xp:br></xp:br>
</xp:repeat>
</xp:repeat>
</xp:repeat>
</xp:panel>
<xe:dialog id="dialog1" title="Dialog box">
<xp:panel>
<xe:dialogButtonBar id="dialogButtonBar1">
<xp:panel>
<xp:button value="OK - Refresh repeat1" id="button1">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:getComponent("dialog1").hide("repeat1")}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:button value="OK - Refresh repeat2" id="button4">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:getComponent("dialog1").hide("repeat2")}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:button value="OK - Refresh repeat3" id="button2">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:getComponent("dialog1").hide("repeat3")}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
</xp:panel>
</xe:dialogButtonBar>
</xp:panel>
</xe:dialog>
</xp:view>
Have you considered to put a panel (or eventually a custom control) inside the repeats and instead of targeting the repeat, target the panel. There are a number of examples that can help you there:
Trigger a server event handler from the client
Call refresh from another component
Refresh more than one target ID
Enventually inside your repeats you might want to add the local id (the generated one) to a local JS object, so you have full control. Let us know how it goes.

Resources