Save Multiple Repeats With One Save Action

Question

I have one repeat control on my XPage. I build my repeat based on what the user selects. The repeat control could have anywhere from 1 to 10 items. Each repeat creates new documents.

Is there a way to have one save button that saves every repeat rather than having an individual save button in each one?

<?xml version="1.0" encoding="UTF-8"?>
<xp:view
    xmlns:xp="http://www.ibm.com/xsp/core">
    <xp:repeat
        id="repeat1"
        rows="30"
        var="rowData"
        indexVar="rowIndex">
        <xp:this.value><![CDATA[#{javascript:["1","2","3"]}]]></xp:this.value>
        <xp:inputText
            id="Number"
            defaultValue="#{javascript:rowData}" />
        <xp:button
            value="Save"
            id="button1">
            <xp:eventHandler
                event="onclick"
                submit="true"
                refreshMode="complete">
                <xp:this.action><![CDATA[#{javascript:var doc = database.createDocument();
doc.appendItemValue("Form","PersonDoc");
doc.save();

var doc2 = database.createDocument();
doc2.appendItemValue("Form", "PlaceDoc"); // I need the ability to create multiple documents
doc2.save();}]]></xp:this.action>
            </xp:eventHandler>
        </xp:button>
        <xp:br />
    </xp:repeat>
    <xp:br />
    <xp:button
        value="Master Save"
        id="button2" />
    <xp:label
        id="label1">
        <xp:this.value><![CDATA[<-- Able to call save once here instead of having to save 3 individual times in repeat?]]></xp:this.value>
    </xp:label>
</xp:view>

Answer 1

Combined some CSJS from this stackoverflow answer (https://stackoverflow.com/a/10031076) with a remote service SSJS call, and came up with the below, which I think does what you want. But as Frantisek said, using Java beans may be a better solution.

The XPage below has a simple repeat on it, displaying 3 inputs with different values. Clicking the "Master Save" button will pull out the values of all the input textboxes in the repeat using CSJS, then makes a call to a jsonRpcService to run the SSJS that creates the documents. I added lines to pump the input values into the saved documents as well, as an 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">
<xp:repeat id="repeat1" rows="30" var="rowData" indexVar="rowIndex">
    <xp:this.value><![CDATA[#{javascript:["1","2","3"]}]]></xp:this.value>
    <xp:inputText id="Number" defaultValue="#{javascript:rowData}" />
</xp:repeat>
<xp:br />

<xp:button id="masterSave3" value="Master Save">
    <xp:eventHandler event="onclick" submit="false">
        <xp:this.script><![CDATA[
            var domEl = dojo.byId('#{id:repeat1}');

            //Get array of input textboxes
            var textBoxes = domEl.getElementsByTagName("input");

            //Pull out values of the textBoxes
            var valueList = [];
            for(var i = 0; i < textBoxes.length; i++) {
                valueList[i] = textBoxes[i].value;
            }

            //Call the remote service that runs SSJS, passing in array of values
            var deferred = masterSaveSvc.saveMethod(valueList);
            deferred.addCallback(function(result) {
                //Optional, display an alert upon completion, or perform some other code
                alert(result);
            });
        ]]>
        </xp:this.script>
    </xp:eventHandler>
</xp:button>

<xe:jsonRpcService id="jsonRpcService1" serviceName="masterSaveSvc">
    <xe:this.methods>
        <xe:remoteMethod name="saveMethod">
            <xe:this.arguments>
                <xe:remoteMethodArg name="valueList"></xe:remoteMethodArg>
            </xe:this.arguments>
            <xe:this.script><![CDATA[
                //For each entry in the array
                for(var i = 0; i < valueList.length; i++) {
                    //Create new document
                    var doc = database.createDocument();
                    doc.appendItemValue("Form", "PersonDoc");
                    //Add current value to the document
                    doc.appendItemValue("Name", valueList[i]);
                    doc.save();

                    //Create another new document
                    var doc2 = database.createDocument();
                    doc2.appendItemValue("Form", "PlaceDoc");
                    //Add current value to the document
                    doc2.appendItemValue("Place", valueList[i]);
                    doc2.save();

                    //Print values to the server console
                    println("value " + (i+1) + ": " + valueList[i]);
                }                       
                return "finished";
            ]]>
            </xe:this.script>
        </xe:remoteMethod>
    </xe:this.methods>
</xe:jsonRpcService>
</xp:view>

Answer 2

I highly recommend to read something about data binding to Java beans.

http://www.mindoo.de/web/blog.nsf/dx/16.07.2009095816KLEBCY.htm

http://www.mindoo.com/web/blog.nsf/dx/22.07.2009175255KLELM7.htm

It will help you to gather data from various places on page (repeats in our case) and you need just implement save() method to save your data on single button, but to many documents.

Answer 3

I believe there is a simple action for buttons called "save datasources" or similar. That should save all data sources that exist on the XPage at once.

As an alternative, wrap the repeat control inside a panel. Then use a SSJS like this:

var c = getComponent("mypanel");
var ds = c.getData();

to get a list of datasources of that panel. I know that a datasource object has a "refresh" method, and I assume it has a "save" method, too. So you could get through the list of datasources with a for...next loop and execute the save method of each datasource.

See http://xpageswiki.com/web/youatnotes/wiki-xpages.nsf/dx/Work_with_datasources#Reset+%2F+clear+a+datasource for an example regarding the refresh method.