Xpages - Call bean method on click of a button

Question

I have a form displayed in read mode using custom control which is bound to a view scoped bean. I need to have a picker on this CC so that users can select other documents. These display as links (generated using repeat control). I planned to trigger a method in my view scoped bean to save this value when selection changes.

Now I am stuck with:

onChange event of multi-valued field (used with picker) does not trigger SSJS code
I tried creating a button which I clicked using CSJS on onChange of above field - this does not work either.

In short, SSJS code is not being triggered.

This is troubling me as I have a created a file download control wherein I have added a remove button calling a method in bean and it works just fine.

I am using Debugtoolbar by Mark Leusink and I am not able to display a simple message or set any scope variable. this is happening for onChange and onClick events!! I have provided my CC code below. If you want you can put it in any Xpage bound to a view scoped bean.

    <?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:panel id="panel1">
        <xp:inputTextarea id="inputTextarea1" style="display:none" value="#{viewScope[compositeData.pickerDetails.beanName][compositeData.pickerDetails.saveToField]}"
            multipleSeparator=","
        >
            <xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="repeatLinks">
                <xp:this.action><![CDATA[#{javascript://viewScope[compositeData.pickerDetails.beanName][compositeData.pickerDetails.saveToField]= getComponent("inputTextarea1").getValue();
//viewScope.get(compositeData.pickerDetails.beanName).setValue(compositeData.pickerDetails.saveToField,getComponent("inputTextarea1").getValue());
//viewScope[compositeData.pickerDetails.beanName].linkDocs(compositeData.pickerDetails.saveToField,getComponent("inputTextarea1").getValue());}]]></xp:this.action>
                <xp:this.script><![CDATA[//console.log("Btn found : "+document.getElementById(getID("btnLinks")));
document.getElementById(getID("btnLinks")).click();]]></xp:this.script>
            </xp:eventHandler>
        </xp:inputTextarea>
        <xe:valuePicker id="valuePicker1" listHeight="auto" listWidth="auto" dialogTitle="#{javascript:compositeData.pickerDetails.title}" for="inputTextarea1">
            <xe:this.dataProvider>
                <xe:simpleValuePicker labelSeparator="|">
                    <xe:this.valueList><![CDATA[#{javascript:var cd = compositeData.pickerDetails;
getPickerList(cd.viewName,cd.filter,cd.filterField);}]]></xe:this.valueList>
                </xe:simpleValuePicker>
            </xe:this.dataProvider>
        </xe:valuePicker>
        <xp:repeat id="repeatLinks" rows="30" var="docLink">
            <xp:this.value><![CDATA[#{viewScope[compositeData.pickerDetails.beanName][compositeData.pickerDetails.saveToField]}]]></xp:this.value>
            <xp:text escape="false" id="computedField1">
                <!-- Link is generated here -->
            </xp:text>
            <xp:br></xp:br>
        </xp:repeat>

        <xp:button value="Click Me" id="btnLinks" refreshId="repeatLinks" refreshMode="partial">
            <xp:this.onclick><![CDATA[#{javascript:viewScope[compositeData.pickerDetails.beanName].linkDocs(compositeData.pickerDetails.saveToField,getComponent("inputTextarea1").getValue());}]]></xp:this.onclick>
        </xp:button>
    </xp:panel>
</xp:view>

score 1 · Answer 1 · answered Aug 05 '15 at 12:41

1

You mention this is a custom control. The most likely cause then is validation failure elsewhere on the page. Your button calls SSJS without execMode="partial" and an execId. This means the complete XPage is validated during the partial refresh. Your refreshId doesn't include an errors block, so there's nothing to alert the user (and you!) if there is a validation error.

Setting execMode="partial" and execId="panel1" on your button should resolve the problem.

If that's the case, for the future I would recommend adding a PhaseListener into your applications so you can easily output what phases are being triggered and/or always ensuring the refreshArea includes an errors control.

answered Aug 05 '15 at 12:41

Paul Stephen Withers

15,699
1
15
33

Thanks Paul, when I write code in Events tab, it is simply not triggered. What you see in onClick above, I have put in under events in All Properties. Not sure if this is my designer or something. However, if I put it like above, it triggers earlier phase and I can't trigger it again. – Arun Aug 05 '15 at 15:02
For a start, you're computing the value of the onClick event in SSJS. If you click on the editor in All Properties, you'll find that it displays the *Client-Side* Javascript editor. So the SSJS you've entered is computed during the initial render response phase and would be used to compute output that will run as client-side JavaScript. Move it back to the Events tab, ensure it's put on the "Server" tab, then try looking for a validation error. – Paul Stephen Withers Aug 05 '15 at 15:11
Already tried that. Is there a way to find out if SSJS code is triggered or not? I tried setting scope variables/debug messages but to no avail. I added CSJS on onComplete of onChange event here and it triggers. But not my SSJS code. I added error controls and there is no error as such. – Arun Aug 05 '15 at 16:33
I added an alert message for onClientLoad event of panel1 in code above using view.postScript method. It does not work as well. Same for info message in DebugToolbar!! – Arun Aug 05 '15 at 16:41
A PhaseListener is the best way to identify whether a partial refresh is triggered and what phases are processed. Tony McGuckin added an XSnippet about it http://openntf.org/XSnippets.nsf/snippet.xsp?id=xpages-request-processing-lifecycle-explorer-code.... Code 2 registers it in faces-config, code 3 is the Java class that is the PhaseListener. – Paul Stephen Withers Aug 05 '15 at 16:41
PhaseListener was not helpful here. Its not triggered as well. Could it be because this Custom Control is part of another custom control inside a panel? I am using XSP.partialRefreshGet to refresh the panel and display relevant CC based on which view user has selected. – Arun Aug 05 '15 at 17:46
I finally used RPC service to update my document and CSJS code in onChange event to trigger it. onComplete of this onChange event is used to refresh the panel displaying the list of links. But why it was not calling SSJS code is still eluding me!! – Arun Aug 06 '15 at 06:04
It depends how you changed the code in your snippet. I would be surprised if that snippet worked how you're trying to make it work. It should not need RPC. In six years of development, I've never had to use that to get a partial refresh to happen. – Paul Stephen Withers Aug 06 '15 at 07:57

score 1 · Answer 2 · answered Aug 05 '15 at 12:49

1

If you remove the style "display:none;" does the code then trigger?

There might be a validation failure that's taking place. What happens if you select "process data without validation" for these events?

answered Aug 05 '15 at 12:49

John Vincent Jardin

284
4
10

Hi John, displaying the field simply shows values getting updated in field from value picker. It does not cause any error. – Arun Aug 05 '15 at 16:06

Xpages - Call bean method on click of a button

2 Answers2