XBL Companion Javascript, Multiple Custom Function Triggers

Hello All!

I am having an issue with the implementation of my own companion java-script
class, the issue is around calling my own custom functions declared inside
the javascript but I cannot call separate custom functions from within my
XBL.

I have my class declared and all working with the following. (Snippet)

(function() {

    // Optional shortcut to jQuery
    var $ = ORBEON.jQuery;

    // Register your companion class by its binding name
    ORBEON.xforms.XBL.declareCompanion("workflow|pdf-viewer", {

        // Your custom data goes here
        init: function() {
        },

        // Your custom functions go here
        displayPDF: function(val) {
            ... Do stuff ...
            });
        },
        onNextPage: function () {
             ... Do Stuff ...
        },  
       onPrevPage: function () {
             ... Do Stuff ...
        },          
    })
})();

Now I have my XBL component declared with the following...

<xbl:xbl {Name Spaces}>
    <xbl:script src="/xbl/workflow/pdf-viewer/pdf-viewer.js" />


    <xbl:binding id="workflow-pdf-viewer"
                        element="workflow|pdf-viewer"
                        xxbl:mode="lhha binding javascript-lifecycle">

        <metadata xmlns="http://orbeon.org/oxf/xml/form-builder">
            <display-name lang="en">PDF Viewer</display-name>
            <icon lang="en">
            </icon>
            <template>
                <workflow:pdf-viewer id="" ref="" xmlns="">
                    <xf:label ref="" />
                    <xf:hint ref="" />
                    <xf:help ref="" />
                    <xf:alert ref="$fr-resources/detail/labels/alert" />
                </workflow:pdf-viewer>
            </template>
        </metadata>
        <xbl:resources>
            <xbl:style src="" />
        </xbl:resources>
        <xbl:template>
           
            <xf:model id="local-model">
                <xf:instance>
                    <test></test>
                </xf:instance>
               
                <xf:bind id="test-bind" name="test" ref="instance()"/>
            </xf:model>
            <xf:group id="workflow-component-group" model="local-model">
             ... My Triggers and Actions are here ....
            </xf:group>
        </xbl:template>
    </xbl:binding>
</xbl:xbl>

Now I can call my displayPDF function with the following (from inside the
<xf:group> )

<xf:trigger>
    <xf:label value="'Display PDF'"/>
        <xf:action type="javascript" ev:event="DOMActivate"
observer="workflow-pdf-viewer">
        <xf:param
            name="testValue"
            value="bind('test-bind')"/>
        <xf:body>
           
ORBEON.xforms.XBL.instanceForControl(this).displayPDF(testValue);
        </xf:body>
    </xf:action>
</xf:trigger>

This works! However if I want another trigger to call a different function
on the java script, it will trigger ALL the javascript actions (As they all
have the same observer (but I need them to, to have the javasctipt to map
correctly))

Example:

<xf:trigger>
    <xf:label value="'Display PDF'"/>
        <xf:action type="javascript" ev:event="DOMActivate"
observer="workflow-component-group">
        <xf:param
            name="testValue"
            value="bind('test-bind')"/>
        <xf:body>
           
ORBEON.xforms.XBL.instanceForControl(this).displayPDF(testValue);
        </xf:body>
    </xf:action>
</xf:trigger>
<xf:trigger class="next">
    <xf:label value="'Next Page'"/>
    <xf:action type="javascript" event="DOMActivate"
observer="workflow-component-group">
        <xf:body>
            ORBEON.xforms.XBL.instanceForControl(this).onNextPage();
        </xf:body>
    </xf:action>
</xf:trigger>

Is there a way I can call multiple custom functions on the javascript using
triggers?

I believe the main cause is because all my triggers have the same observers
on the actions, and once the DOMAcitvate event is triggered on one, the
other events also are fired! however I need the Observer's to be the same as
its the only way the javascript maps correctly to the action. Is there
another way of getting this mapping working without using the same
observers?

Thanks for your time, Sorry for the lengthy one, Little stuck at the moment.

Cheers,
Joel.



--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1568037843565-0.post%40n4.nabble.com.

I have found a way around this, by using event listeners inside the javascript. Code for my event listeners that attach the onPrevPage and onNextPage functions to the buttons with the class prev and next.

init: function() {
var xblContext = this;
$(xblContext.container).find('.prev')[0].addEventListener('click', xblContext.onPrevPage.bind(xblContext));
$(xblContext.container).find('.next')[0].addEventListener('click', xblContext.onNextPage.bind(xblContext));
},

---

Sent from the Orbeon Forms community mailing list mailing list archive at Nabble.com.

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1568100875157-0.post%40n4.nabble.com.

Hi Joel,

I might be missing something, but it seems to me that you could just remove
the `observer` attribute on your `<xf:action>`. Without the `observer`, the
action is observing the parent element, so just the trigger you're
interested in. You'll let me know if this works for you.

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1568134086908-0.post%40n4.nabble.com.

The issue I had here was I had my buttons in a grid, so when they tried to
call the Java-Script it said  it couldn't find the function (I believe the
context ($(this)) was the grid rather than the xblClass! So it works if I
don't have any of the triggers in a grid!

Cheers for the reply.
Joel.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1568157088948-0.post%40n4.nabble.com.

Got it Joel. I imagine we don't need to dig too much into this since you made
it work. But listeners should work in repeated grid. If you (or someone
else) stumbles on this again in the future, we would need to have test we
can run locally to reproduce and debug the issue.

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1568245165938-0.post%40n4.nabble.com.