David Navarre
David Navarre

Reputation: 1022

Can pagerControls have onclick events?

I've got a dynamic view that totals what's displayed on the screen using a viewScope variable and I want to have it reset my viewScope variable. It doesn't and it appears not to be executing any script I put in there.

<xp:pager partialRefresh="true" id="upperPager"
for="viewRowRepeat" styleClass="tsDynamicViewPager" pageCount="8"
alwaysCalculateLast="true">
<xp:pagerControl id="pagerControl4" type="First">
    <xp:eventHandler event="onclick" submit="true" refreshMode="partial" refreshId="viewRowRepeat">
        <xp:this.action><![CDATA[#{javascript:dBar.info("pagerControl4 clicked");
clearColumnTotals();}]]></xp:this.action>
            <xp:this.script><![CDATA[alert("Clicked!");]]></xp:this.script>
        </xp:eventHandler>
    </xp:pagerControl>
    <xp:pagerControl id="pagerControl5" type="Group">
        <xp:eventHandler event="onclick" submit="true" refreshMode="complete">
            <xp:this.action><![CDATA[#{javascript:dBar.info("pagerControl5 clicked");
clearColumnTotals();}]]></xp:this.action>
            <xp:this.script><![CDATA[alert("Clicked!");]]></xp:this.script>
        </xp:eventHandler>
    </xp:pagerControl>
    <xp:pagerControl id="pagerControl6" type="Last">
        <xp:eventHandler event="onclick"
            submit="true" refreshMode="complete">
            <xp:this.action><![CDATA[#{javascript:dBar.info("pagerControl6 clicked");
clearColumnTotals();}]]></xp:this.action>
            <xp:this.script><![CDATA[alert("Clicked!");]]></xp:this.script>
        </xp:eventHandler>
    </xp:pagerControl>
</xp:pager>

Needless to say, I don't know if I've coded it incorrrectly or if there isn't supposed to be any onclick event for pagerControls. I know the IDE doesn't show one for pagers themselves.

Upvotes: 1

Views: 342

Answers (1)

Knut Herrmann
Knut Herrmann

Reputation: 30960

Connect your pager controls with a Dojo onclick event to execute client side code when pager control is clicked:

<xp:eventHandler
    event="onClientLoad"
    submit="false">
    <xp:this.script><![CDATA[
        dojo.query(".xspFirst").forEach(function(node) {
          dojo.connect(node, "onclick", function() { 
               alert("First clicked");
          });
        });
        dojo.query(".xspGroup").forEach(function(node) {
          dojo.connect(node, "onclick", function() { 
               alert("Group clicked");
          });
        });
        ...
    ]]>
    </xp:this.script>
</xp:eventHandler>

Classes rendered for pager controls are "xsp" + type like "xspFirst", "xspGroup" and "xspLast". Use this classes to get the controls.

Upvotes: 2

Related Questions