Xpage Custom Controls not displaying in edit mode - xpages

Question

I have an xPage with a couple custom controls. One CC nested inside the other. When I place the xPage into edit mode the innermost CC does not swich to edit mode but it's containing CC does. What am I missing here? The edit button is just a simple 'change document mode' action.
xPage Code
<?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="Test"></xp:dominoDocument>
</xp:this.data>
<xp:button value="Edit" id="button1">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
<xp:changeDocumentMode mode="edit" var="document1"></xp:changeDocumentMode>
</xp:this.action></xp:eventHandler></xp:button>
<xp:button value="Submit" id="button2">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete" immediate="false" save="true">
</xp:eventHandler>
</xp:button>
<xc:Outer></xc:Outer>
</xp:view>
Outer Custom Control
<?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="Test"></xp:dominoDocument>
</xp:this.data>
<xp:table style="border-color:rgb(0,64,128);border-style:solid;border-width:medium">
<xp:tr>
<xp:td>
<xp:label id="label1" value="Outer CC"></xp:label>
</xp:td>
<xp:td>
<xp:button value="Edit" id="button1">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action>
<xp:changeDocumentMode mode="edit"></xp:changeDocumentMode>
</xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:button value="Submit" id="button2"><xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true"></xp:eventHandler></xp:button></xp:td>
</xp:tr>
<xp:tr>
<xp:td>
<xp:label value="Outer Field" id="label2"></xp:label>
</xp:td>
<xp:td>
<xp:inputText id="inputText1"
value="#{document1.FieldOuter}">
</xp:inputText>
</xp:td>
</xp:tr>
<xp:tr>
<xp:td></xp:td>
<xp:td></xp:td>
</xp:tr>
<xp:tr>
<xp:td></xp:td>
<xp:td>
<xc:Inner></xc:Inner></xp:td>
</xp:tr>
</xp:table>
</xp:view>
Inner Custom Control
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:this.data>
<xp:dominoDocument var="document1" formName="Test"></xp:dominoDocument>
</xp:this.data>
<xp:table style="border-color:rgb(255,128,0);border-style:solid;border-width:medium">
<xp:tr>
<xp:td>
<xp:label value="Inner CC" id="label1"></xp:label>
</xp:td>
<xp:td>
<xp:button value="Edit" id="button1"><xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
<xp:changeDocumentMode mode="edit" var="document1"></xp:changeDocumentMode>
</xp:this.action></xp:eventHandler></xp:button>
<xp:button value="Submit" id="button2"><xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true"></xp:eventHandler></xp:button></xp:td>
</xp:tr>
<xp:tr>
<xp:td>
<xp:label value="Field Inner" id="label2"></xp:label>
</xp:td>
<xp:td>
<xp:inputText id="inputText1" value="#{document1.FieldInner}"></xp:inputText>
</xp:td>
</xp:tr>
</xp:table>
</xp:view>

Answer 1

Each Custom Control and your xpage all have a datasource but they have the same name and are bound to the same document as they are not ignoring request params. The Change Document Mode button is looking for the first datasource on the page with the var specified and changing that to read only and hence only updating for fields that are bound to that datasource. I would ensure you only have a single datasource with the same name and work it that way.