XPages - get value of a textarea inside a dialog - Part 2

Question

Follow on from my previous question: I am trying unsuccessfully to get a handle on the text input into a textarea which is contained inside an xe:dialog. The xe:dialog "pops up" after a button on the XPage is pressed. Here is my code:

<xe:dialog id="InputDialog5">
<xe:this.title>Input Dialog</xe:this.title>
<xp:panel>
<xp:inputTextarea id="InputTextBox5" value="#{document1.InputTextBox5}" 
cols="60" rows="4" styleClass="StatusDialogLabel"></xp:inputTextarea>
</xp:panel>
<xe:dialogButtonBar id="dialogButtonBar15">
<xp:button value="OK" id="button37">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete" immediate="true">
<xp:this.action>
<![CDATA[#{javascript:var inputVal = document1.getValue("InputTextBox5");
setJobReferenceStatus(40,inputVal);
var redirect = "window.location='"+applicationScope.get("redirect")+"'";
facesContext.getViewRoot().postScript(redirect);
}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
</xe:dialogButtonBar>
</xe:dialog>

Unfortunately the line document1.getValue("InputTextBox5"); is not working and passes "null" rather than the value contained in the field to the setJobReferenceStatus function. Any idea why this code is not working?

Answer 1

Remove immediate="true" from your eventHandler.

Every event supports two options for bypassing validation (see this answer more more details). Note that in Per's answer, the eventHandler includes the attribute assignment disableValidators="true". This maps to the "Process data without validation" option, whereas immediate="true" maps to the "Do not validate or update data" option.

When this latter option is used, the event runs without pushing any updates to the data model (i.e. document), which is why the value of your edit box is null even if the user has populated a value. If you replace immediate="true" with disableValidators="true", your event will still run without triggering any validation failures, but the data model will contain any value the user populated in the edit box.

Answer 2

Here's a working example of reading the content of the textarea field using SSJS (and outputting the value to a computed field for test purposes):

<?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:this.data>
        <xp:dominoDocument var="document1"></xp:dominoDocument>
    </xp:this.data>

    <xp:button value="Label" id="button1">
        <xp:eventHandler event="onclick" submit="true" refreshMode="complete">
            <xp:this.action><![CDATA[#{javascript:getComponent("InputDialog5").show()}]]></xp:this.action>
        </xp:eventHandler>
    </xp:button>

    <xe:dialog id="InputDialog5">
        <xe:this.title>Input Dialog</xe:this.title>
        <xp:panel id="refreshPanel">
            <xp:inputTextarea id="InputTextBox5" value="#{document1.InputTextBox5}" cols="60" rows="4" styleClass="StatusDialogLabel"></xp:inputTextarea>
            <xp:br />
            <xp:br />
            <xp:text escape="true" id="computedField1"></xp:text>
        </xp:panel>
        <xe:dialogButtonBar id="dialogButtonBar15">
            <xp:button value="OK" id="button37">
                <xp:eventHandler event="onclick" submit="true" refreshMode="partial" refreshId="refreshPanel" disableValidators="true">
                    <xp:this.action><![CDATA[#{javascript:
                            getComponent("computedField1").setValue(document1.getValue("InputTextBox5"));
                        }]]></xp:this.action>
                </xp:eventHandler>
            </xp:button>
        </xe:dialogButtonBar>
    </xe:dialog>
</xp:view>

Notice how I partially refresh the panel within the dialog.