dojoxpagesrepeatcheckboxlisttabcontainer

Xpages nested dojo tab container repeat dojo tab panel with checkboxgroup - does not update


Hi I'm new to Xpages and have encountered an issue for which I am unable to find a relevant question / answer after searching (see title for search terms).

I would be grateful for insight into how to solve the following issue.

I have a nest of 3 Dojo Tab Containers, each container holds a repeat container with a Dojo Tab Control, the inner most Tab Control carries a standard checkBoxGroup.

The computed labels for the tabs are read from a multi-dimensional sessionScope variable, the final dimension carries the computed 'label|value' pairs for the checkBoxGroup. The data is bound to a document.

I can switch between the various tabs and select/deselect check boxes and the status remains tracked when switching back an forth among the tabs. However, and this is the crux, only the checkBoxGroup values on the final tab are written back to the underlying document on submission, the checkBoxGroup values displayed on the other innermost tabs are ignored.

Any advice guidance on how to resolve this issue would be gratefully received.

    <xe:djTabContainer id="djTabContainer1"
                        style="height:600px;width:1200.0px"
                        doLayout="false">
                        <xe:this.rendered><![CDATA[#{javascript:control = getComponent("STP2radioGroup1");
control2 = getComponent("STP2radioGroup2");

if (control == null || control2 == null){return false;};

val = control.getValue();
val2 = control2.getValue();

if (val == "None" || val2 == "All") {
    false ;
}                           
else {
    true;
}}]]></xe:this.rendered>
                        <xp:repeat id="repeat1" rows="30"
                            value="${sessionScope.GHC}" var="GHCTabs" first="0"
                            indexVar="GHCTabIndex" repeatControls="true">
                            <xe:djTabPane id="djTabPane1"
                                title="#{javascript:GHCTabs}">
                                <xe:this.rendered><![CDATA[#{javascript:!empty(sessionScope.Services[GHCTabIndex])}]]></xe:this.rendered>
                                <xe:djTabContainer id="djTabContainer2"
                                    style="height:550px" doLayout="false">
                                    <xp:repeat id="repeat3" rows="30"
                                        value="${sessionScope.Enviro}" var="EnviroTabLables"
                                        indexVar="EnviroTabIndex" first="0" repeatControls="true">
                                        <xe:djTabPane id="djTabPane2"
                                            title="#{javascript:EnviroTabLables}">
                                            <xe:this.rendered><![CDATA[#{javascript:!empty(sessionScope.Services[GHCTabIndex][EnviroTabIndex])}]]></xe:this.rendered>
                                            <xe:djTabContainer
                                                id="djTabContainer3" style="height:500px"
                                                doLayout="false">
                                                <xp:repeat id="repeat2"
                                                    rows="30" value="${sessionScope.Aspect}" var="AspectTabs"
                                                    indexVar="AspectTabIndex" first="0"
                                                    repeatControls="true">
                                                    <xe:djTabPane
                                                        id="djTabPane3" title="#{javascript:AspectTabs}">
                                                        <xe:this.rendered><![CDATA[#{javascript:try{
if (sessionScope.Services[GHCTabIndex][EnviroTabIndex][AspectTabIndex] == null){false}
else
{true}
}
catch(e){
dBar.error("Error in 'Visible' property for Aspect Tab for checkBoxGroup - " + e.toString)}}]]></xe:this.rendered><xp:checkBoxGroup
                                                            id="checkBoxGroup1" styleClass="threeColumnCheckboxGroup"
                                                            value="#{Subscription.Services}" style="width:100.0%">
                                                            <xp:selectItems>
                                                                <xp:this.value><![CDATA[${javascript:try{
if (sessionScope.Services[GHCTabIndex][EnviroTabIndex][AspectTabIndex] == null){
dBar.error("sessionScop.Services["+GHCTabIndex+"]["+EnviroTabIndex+"]["+AspectTabIndex+"] = null")}
else
{sessionScope.Services[GHCTabIndex][EnviroTabIndex][AspectTabIndex]}
}
catch(e){
dBar.error("checkBoxGroup")}}]]></xp:this.value>
                                                            </xp:selectItems>
                                                        </xp:checkBoxGroup>






                                                </xe:djTabPane>
                                            </xp:repeat>
                                        </xe:djTabContainer>
                                    </xe:djTabPane>
                                </xp:repeat>
                            </xe:djTabContainer>
                        </xe:djTabPane>
                    </xp:repeat>
                </xe:djTabContainer>

Solution

  • All rows of the repeat are bound to the same sessionScope variable. That means they will replace not append to the scoped variable.

    For binding editable fields within a repeat, you'll need to do something along the lines of Tim's answer to this question. I would recommend setting repeatControls="true" on all repeats, so the rows are created and bound when the page is loaded. You may get unpredictable results with components bound dynamically because, after the initial load, it's a one-way mapping from the component to wherever the value is stored. If the order of the repeat changes, the component values won't, and so the values will be out of step with what you expect.