# Universal Navigation module

**URL:** <https://forums.fusetools.com/t/universal-navigation-module/5613>\
**Category:** How-to Discussions\
**Created:** [July 25, 2017, 2:19pm UTC](https://forums.fusetools.com/t/universal-navigation-module/5613 "2017-07-25T14:19:48Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Zia\_Karim](https://avatars.discourse-cdn.com/v4/letter/z/9d8465/32.png) [@Zia\_Karim](https://forums.fusetools.com/u/Zia_Karim)\
**Post date:** [July 25, 2017, 2:19pm UTC](https://forums.fusetools.com/t/universal-navigation-module/5613/1 "2017-07-25T14:19:48Z")

</div>

I’m trying to build a universal navigation module in JS, so I can define two main navigation functions:

#### Navigation.js

```auto
function goBack(){
    router.goBack();
}
module.exports = {goBack:goBack}

```

#### Page.js

```auto
Navigation = require('Modules/Navigation');

module.exports={goBack:Navigation.goBack()}

```

The problem I’m getting is that I get a router is not defined. How can I solve this?

Thanks

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [July 25, 2017, 2:50pm UTC](https://forums.fusetools.com/t/universal-navigation-module/5613/2 "2017-07-25T14:50:33Z")

</div>

Funny that I couldn’t find the forum thread where I replied with a solution to this exact challenge earlier.

Anyway, what you want to do is explicitly pass the router to your module. Via a dedicated function.

In your `Navigation.js`:

```auto
var router;
function init(r) {
    router = r;
}
function goBack(){
    router.goBack();
}
module.exports = {
    init: init,
    goBack: goBack
};

```

in your `MainView.js` or whatever else is your top-level viewmodel, on the master page where you have `<Router ux:Name="router" />` in UX - so that the JS viewmodel has access to UX nodes by their `ux:Name`s:

```auto
var Navigation = require('Modules/Navigation');
Navigation.init(router);

```

And finally on your `Page.js`:

```auto
var Navigation = require('Modules/Navigation');
module.exports = {
    goBack: Navigation.goBack
};

```

Note that you only want to set the router once, otherwise all hell will break loose.

Hope this helps!

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [July 25, 2017, 2:55pm UTC](https://forums.fusetools.com/t/universal-navigation-module/5613/3 "2017-07-25T14:55:12Z")

</div>

All that said, our suggestion for the right way to solve multi-level navigation is shown in [Navigation example](https://github.com/fusetools/fuse-samples/tree/master/Samples/UIStructure/Navigation). Please do take a look at that and consider if you _really_ need an abstraction for this, because in our experience you probably don’t.

---

<div class="post-metadata">

**Author:** ![Zia\_Karim](https://avatars.discourse-cdn.com/v4/letter/z/9d8465/32.png) [@Zia\_Karim](https://forums.fusetools.com/u/Zia_Karim)\
**Post date:** [July 26, 2017, 11:10pm UTC](https://forums.fusetools.com/t/universal-navigation-module/5613/4 "2017-07-26T23:10:32Z")

</div>

I tried building a push function, couldn’t get it to work. Is there a way to do that?  
My goal is to simply reduce the amount of code in the js file for each page.

Thanks

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [July 27, 2017, 8:27am UTC](https://forums.fusetools.com/t/universal-navigation-module/5613/5 "2017-07-27T08:27:13Z")

</div>

Sorry, that last question is not clear. Please show some code in a new forum post, since the original challenge in this one has been thoroughly answered.