Geek Answers Handbook

Xpage with multiple forms and data sources creates blank documents

  • I have two simple forms (Form1 and Form2). They have only one field each (field1). I created two user controls. They are identical, except cc1 has a data source defined as Form1, and cc2 has a data source Form 2.
  • Each user control has one input unit associated with field1 corresponding field data source and one submit button. I am creating an Xpage and pull both user controls onto the page.
  • If I view and fill in the input fields on the Xpage in the browser, when I click on any of the submit buttons, two documents will be created based on two forms in the domino database.
  • I tried to use partial update / execution and more. No matter what I do, I always get blank documents of both forms.

XPage:

<xp:div styleClass="container" style="margin-top:20px">
   <xp:div styleClass="row">
     <xc:cc1></xc:cc1>
     <xc:cc2></xc:cc2>
   </xp:div>
 </xp:div>

User Management 1

 <xp:this.data>
    <xp:dominoDocument var="form1" formName="form1"></xp:dominoDocument>
  </xp:this.data>
  <xp:div id="formDiv1" styleClass="col-sm-4">
    <xp:form>
      <xp:label value="Form 1" styleClass="h3"></xp:label>
      <xp:div styleClass="form-group">
        <xp:label value="Field 1" styleClass="control-label"></xp:label>
        <xp:inputText value="#{form1.field1}"></xp:inputText>
      </xp:div>
      <xp:button value="Submit Form1" id="form1Btn">
        <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="true" refreshId="formDiv1"
          execMode="partial" execId="formDiv1">
        </xp:eventHandler>
      </xp:button>
    </xp:form>

User Control 2

 <xp:this.data>
    <xp:dominoDocument var="form2" formName="form2"></xp:dominoDocument>
  </xp:this.data>
  <xp:div id="formDiv1" styleClass="col-sm-4">
    <xp:form>
      <xp:label value="Form 2" styleClass="h3"></xp:label>
      <xp:div styleClass="form-group">
        <xp:label value="Field 1" styleClass="control-label"></xp:label>
        <xp:inputText value="#{form2.field1}"></xp:inputText>
      </xp:div>
      <xp:button value="Submit Form2" id="form2Btn">
        <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="true" refreshId="formDiv1"
          execMode="partial" execId="formDiv1">
        </xp:eventHandler>
      </xp:button>
    </xp:form>

+4
source share
3 answers

A regular submit button gets the property save="true"and saves all data sources.

If you want to keep only one source , then use a simple action Save Documentand select a data source:

enter image description here

Set property save="false". Your button code will look like this:

<xp:button
    id="form1Btn"
    value="Submit Form1">
    <xp:eventHandler
        event="onclick"
        submit="true"
        refreshMode="complete"
        immediate="false"
        save="false">
        <xp:this.action>
            <xp:saveDocument
                var="form1"></xp:saveDocument>
        </xp:this.action>
    </xp:eventHandler>
</xp:button>
+3
source

Here is the code that works using Knut's suggestion:

XPage

<xp:div styleClass="container" style="margin-top:20px">
    <xp:div styleClass="row">
      <xc:cc1></xc:cc1>
      <xc:cc2></xc:cc2>
    </xp:div>
  </xp:div>

CC1

<xp:panel id="formDiv1" styleClass="col-sm-4">
    <xp:this.data>
      <xp:dominoDocument var="form1" formName="form1"></xp:dominoDocument>
    </xp:this.data>
    <xp:label value="Form 1" styleClass="h3"></xp:label>
    <xp:div styleClass="form-group">
      <xp:label value="Field 1" styleClass="control-label"></xp:label>
      <xp:inputText id="field1" value="#{form1.field1}"></xp:inputText>
    </xp:div>
    <xp:button value="Save" id="form1Btn">
      <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="false" execMode="partial"
        execId="formDiv1" refreshId="formDiv1">
        <xp:this.action>
          <xp:actionGroup>
            <xp:saveDocument var="form1"></xp:saveDocument>
            <xp:executeScript>
              <xp:this.script><![CDATA[#{javascript:
var panel = getComponent("formDiv1");
var ds = new com.ibm.xsp.model.domino.DominoDocumentData();
ds.setComponent(panel);
ds.setVar("form1");
ds.setFormName("form1");
panel.getData().clear();
panel.addData(ds);}]]></xp:this.script>
            </xp:executeScript>
          </xp:actionGroup>
        </xp:this.action>
      </xp:eventHandler>
    </xp:button>
  </xp:panel>

CC2

<xp:panel id="formDiv2" styleClass="col-sm-4 ">
    <xp:this.data>
      <xp:dominoDocument var="form2" formName="form2"></xp:dominoDocument>
    </xp:this.data>
    <xp:label value="Form 2" styleClass="h3"></xp:label>
    <xp:div styleClass="form-group">
      <xp:label value="Field 1" styleClass="control-label"></xp:label>
      <xp:inputText id="field1" value="#{form2.field1}">
      </xp:inputText>
    </xp:div>
    <xp:button value="Submit Form2" id="form2Btn">
      <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="false" execMode="partial"
        execId="formDiv2" refreshId="formDiv2">
        <xp:this.action>
          <xp:actionGroup>
            <xp:saveDocument var="form2"></xp:saveDocument>
            <xp:executeScript>
              <xp:this.script><![CDATA[#{javascript:
var panel = getComponent("formDiv2");
var ds = new com.ibm.xsp.model.domino.DominoDocumentData();
ds.setComponent(panel);
ds.setVar("form2");
ds.setFormName("form2");
panel.getData().clear();
panel.addData(ds);}]]></xp:this.script>
            </xp:executeScript>
          </xp:actionGroup>
        </xp:this.action>
      </xp:eventHandler>
    </xp:button>
  </xp:panel>
+2

Paul Wither suggests using the requestScope scope for data sources, making the code pretty simple:

XPage

<xp:div styleClass="container" style="margin-top:20px">
    <xp:div styleClass="row">
      <xc:cc1></xc:cc1>
      <xc:cc2></xc:cc2>
    </xp:div>

custom control 1

<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
  <xp:this.data>
    <xp:dominoDocument var="form1" formName="form1" scope="request"></xp:dominoDocument>
  </xp:this.data>
  <xp:div id="formDiv1" styleClass="col-sm-4">
    <xp:label value="Form 1" styleClass="h3"></xp:label>
    <xp:div styleClass="form-group">
      <xp:label value="Field 1" styleClass="control-label"></xp:label>
      <xp:inputText id="field1" value="#{form1.field1}"></xp:inputText>
    </xp:div>
    <xp:button value="Save" id="form1Btn">
      <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="false" execMode="partial" execId="formDiv1"
        refreshId="formDiv1">
        <xp:this.action>
          <xp:actionGroup>
            <xp:saveDocument var="form1"></xp:saveDocument>
          </xp:actionGroup>
        </xp:this.action>
        <xp:this.onComplete><![CDATA[x$("#{id:field1}").val("");]]></xp:this.onComplete>
      </xp:eventHandler>
    </xp:button>
  </xp:div>
</xp:view>

user control 2

<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
  <xp:this.data>
    <xp:dominoDocument var="form2" formName="form2" scope="request"></xp:dominoDocument>
  </xp:this.data>
  <xp:div id="formDiv2" styleClass="col-sm-4 ">
    <xp:label value="Form 2" styleClass="h3"></xp:label>
    <xp:div styleClass="form-group">
      <xp:label value="Field 1" styleClass="control-label"></xp:label>
      <xp:inputText id="field1" value="#{form2.field1}">
      </xp:inputText>
    </xp:div>
    <xp:button value="Submit Form2" id="form2Btn">
      <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="false" execMode="partial" 
      execId="formDiv2" refreshId="formDiv2">
        <xp:this.action>
          <xp:actionGroup>
            <xp:saveDocument var="form2"></xp:saveDocument>
          </xp:actionGroup>
        </xp:this.action>
        <xp:this.onComplete><![CDATA[x$("#{id:field1}").val("");]]></xp:this.onComplete>
      </xp:eventHandler>
    </xp:button>
  </xp:div>
</xp:view>
+2
source

More articles:


All Articles