Use XSP.partialRefreshPost function in XPages Extension Library dialog

Question

In a xe:dialog (XPages Extension Library dialog), I want to use XSP.partialRefreshPost function, but when refreshing the entered values are lost.

The following example demonstrate the problem.

ComboBox1, inputText1, ComboBox2, inputText2 : OK but not in a xe:dialog
ComboBox3, inputText3 : OK but not use XSP.partialRefreshPost
ComboBox4, inputText4 : NOK because it uses XSP.partialRefreshPost function in xe:dialog

I try to change the properties xe:dialog without success.

How to use XSP.partialRefreshPost in a xe:dialog to have refresh OK ?

Thanks

<?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:label id="label1" value="refresh partial"></xp:label>
    <xp:comboBox id="comboBox1">
        <xp:selectItems>
            <xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
        </xp:selectItems>
        <xp:eventHandler event="onchange" submit="true" refreshMode="partial"refreshId="comboBox1">
        </xp:eventHandler>
    </xp:comboBox>
    <xp:inputText id="inputText1">
        <xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="inputText1">
        </xp:eventHandler>
    </xp:inputText>
    <xp:br></xp:br>
    <xp:label id="label2" value="refresh XSP.partialRefreshPost"></xp:label>
    <xp:comboBox id="comboBox2">
        <xp:selectItems>
            <xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
        </xp:selectItems>
        <xp:eventHandler event="onchange" submit="false">
            <xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:comboBox2}", {immediate: true});]]></xp:this.script>
  </xp:eventHandler>
    </xp:comboBox>
    <xp:inputText id="inputText2">
        <xp:eventHandler event="onchange" submit="false">
            <xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:inputText2}", {immediate: true});]]></xp:this.script>
        </xp:eventHandler>
    </xp:inputText>
    <xp:br></xp:br>
    <xe:dialog id="dialog1" partialRefresh="true">
        <xp:label id="label3" value="refresh partial"></xp:label>
        <xp:comboBox id="comboBox3">
            <xp:selectItems>
                <xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
            </xp:selectItems>
            <xp:eventHandler event="onchange" submit="true"
                refreshMode="partial" refreshId="comboBox3">
            </xp:eventHandler>
        </xp:comboBox>
        <xp:inputText id="inputText3">
            <xp:eventHandler event="onchange" submit="true"
                 refreshMode="partial" refreshId="inputText3">
            </xp:eventHandler>
        </xp:inputText>
        <xp:br></xp:br>
        <xp:label id="label4" value="refresh XSP.partialRefreshPost"></xp:label>
        <xp:comboBox id="comboBox4">
            <xp:selectItems>
                <xp:this.value><![CDATA[#{javascript:return ["1", "2", "3"];}]]></xp:this.value>
            </xp:selectItems>
            <xp:eventHandler event="onchange" submit="false">
                <xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:comboBox4}", {immediate: true});]]></xp:this.script>
            </xp:eventHandler>
        </xp:comboBox>
        <xp:inputText id="inputText4">
            <xp:eventHandler event="onchange" submit="false">
                <xp:this.script><![CDATA[XSP.partialRefreshPost("#{id:inputText4}", {immediate: true});]]></xp:this.script>
            </xp:eventHandler>
        </xp:inputText>
    </xe:dialog>
    <xp:button id="button1" value="dialog">
        <xp:eventHandler event="onclick" submit="false">
            <xp:this.script><![CDATA[XSP.openDialog('#{id:dialog1}');]]></xp:this.script>
        </xp:eventHandler>
    </xp:button>
</xp:view>

Is this the complete source code? I cannot see a datasource attached, for that you values may be lost as the server cannot hold any of them in memory. — Oliver Busse
Why do you do a partial refresh on inputText2 during the onchange event of inputText2?. And, like Oliver mentioned, where do you store the data? You should at least use a scoped variable to keep the data. — Daniel F
This is just an example to show the problem of partial refresh — JMR

Knut Herrmann Knut Herrmann · Accepted Answer · 2015-01-15T22:41:16

partialRefreshPost doesn't work as expected in <xe:dialog>, e.g., when you choose a value in a combobox then partialRefreshPost sends the selected value on change event to server but server's response contains the old value and combobox value jumps back to old value. Even binding the field to data like a scope variable doesn't help.

But there is a workaround. Add parameter execId to partialRefreshPost:

XSP.partialRefreshPost("#{id:comboBox4}", 
       {execId: "#{id:comboBox4}", immediate: true})

Specify the element which you want to refresh, in this case the same (comboBox4). This way it will work as expected - like outside of a dialog box.

Use XSP.partialRefreshPost function in XPages Extension Library dialog

1 Answers