Raise global event from javascript in child

How-to Discussions
1

Hi!

Is it possible to raise events from child that are places just beneath the main tag from javascript?

2

Hi Palton,

is there something that you have already tried? Your question alone does not provide enough insight to try to answer it.

Some code to explain exactly what you’re trying to achieve would help.

3

Hi Uldis!

I tried the following, but the event is outside of the scope of the page which raises the event.

MainView.ux

<App>
   <JavaScript>
         module.exports = {
              loggedInEventHandler : function() { /* do things here */}
         }
    </JavaScript>
   <UserEvent ux:Name="loggedInEvent"/>
   <OnUserEvent EventName="loggedInEvent" Handler="{loggedInEventHandler}"/>

   <!--- navigator here with several pages -->

</App>

Then inside one of the pages routed to by the navigator:

<Page ux:Class="Login">
    <Router ux:Dependency="router"/>
    <JavaScript>
        loggedInEvent.raise();
    </JavaScript>
</Page>
4

Ah, I see.

The code you have posted looks alright from the UserEvent perspective. The only suspicious thing in it is how you raise the event from that subpage - I think you should put in some function, not just have it laying there.

Other than that, if you have the UserEvent declaration on the root of the App, it is global and can be raised from anywhere else in the app subtree, just as stated in UserEvent docs.

Please check if this example helps you: https://github.com/fusetools/fuse-samples/tree/master/Samples/UserEvents

5

This issue can be resolved using dependency injection.

    <UserEvent ux:Name="eventHttpError" />

<Navigator>
    <Login ux:Name="loginPage" router="router" loggedInEvent="loggedInEvent" />
</Navigator>

<Page ux:Class="Login">
    <Router ux:Dependency="router"/>
    <UserEvent ux:Dependency="loggedInEvent" />
    <JavaScript>
        loggedInEvent.raise();
    </JavaScript>
</Page>