XPages more fields at the click on a button issue with partial refresh

Question

Based on Tim Tripcony's suggestion I have implemented a simple xpage below which allows me to extend no. of fields displayed when a user clicks on the "Add more" button. I have an issue with partial refresh not remembering the data when Add More button does a partial refresh and extends the no. of rows.

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" dojoForm="true">
    <xp:this.data>
        <xp:dominoDocument var="newDoc" formName="frmAddMore"></xp:dominoDocument>
    </xp:this.data>
    <xp:this.afterPageLoad><![CDATA[#{javascript:viewScope.rowCount = new java.lang.Integer(5);}]]></xp:this.afterPageLoad>
    <xp:div id="parentDiv">
        <xp:repeat indexVar="fieldSuffix" value="#{viewScope.rowCount}"
            rows="#{viewScope.rowCount}" var="row">
            <xp:div>
                <xp:inputText id="KeyNo">
                    <xp:this.value><![CDATA[#{newDoc["KeyNo_#{fieldSuffix}"]}]]></xp:this.value>
                </xp:inputText>
                <xp:inputText id="Qty">
                    <xp:this.value><![CDATA[#{newDoc["Quantity_#{fieldSuffix}"]}]]></xp:this.value>
                </xp:inputText>
            </xp:div>
        </xp:repeat>
        <xp:button value="Add More" id="btnAddMore"
            execMode="partial">
            <xp:eventHandler event="onclick" submit="true"
                execMode="partial" execId="parentDiv" refreshMode="partial" refreshId="parentDiv">
                <xp:this.action><![CDATA[#{javascript:viewScope.rowCount = new java.lang.Integer(viewScope.rowCount + 5);}]]></xp:this.action>
                <xp:this.script>
                    <xp:executeClientScript
                        script="dojo.window.scrollIntoView(dojo.byId('#{id:btnAddMore}').id);">
                    </xp:executeClientScript>
                </xp:this.script>
            </xp:eventHandler>
        </xp:button>
    </xp:div>
</xp:view>

What am I missing here?

I have also noticed that the dojo.window.scrollIntoView clientside JS function doesn't work? Any help would be much appreciated.

jjtbsomhorst jjtbsomhorst · Accepted Answer · 2012-04-04T05:05:42

In your code i cant see where the data is actualy saved on the document. So whenever the rowdata is refreshed it iterates over the fields and retrieves the data from. Because data is not saved you lost the data entered by the user.

Add a save simple action to the partialrefresh and it should work. Disable validation if youd like so validation is only done when the user clicks save button of some sort.

XPages more fields at the click on a button issue with partial refresh

2 Answers