Unable to navigate to with route

How-to Discussions
1

Hello
I tried sending some data to a page using router.push but I keep on getting errors
Here is my code

           var Observable = require("FuseJS/Observable");
           var student = Observable("");
           var password = Observable("");
           var matric_no = Observable("");
           var result = Observable("");


           var sqlite = require("SQLite");
           var db  =  sqlite.openFromBundle("result.db");
         function Login(arg){
           var data = arg.data;
           var std_pass = data.password.value;
           var std_matric = data.matric_no.value;

           if(std_pass == '' || std_matric == ''){
              debug_log('Please fill all fields');
            }else{
             var get_ = db.query("select * from student_info where matric_no = ? and password = ?", std_matric, std_pass);
             result.value = get_;
             student = result.value;
                if(result.value != ''){
 	              router.push('mainpage',student); //Here is where i am getting the error from
                   }else{
 	             debug_log("No user found");
           }
  }

Please what can I do?

2

Anybody to help me out please?

3

What is the error message you are getting?

4

The error message is ‘unable to navigate to route mainpage’.

The data is not sending to the main page I specified.
Thanks

5

I need to see more detailed what’s going on in order to be able to help. Can you paste the full console log please?

6

The concept is ,it is a login page whereby at a successful login, informations are being retrieved from the database and sent to the main page for further use but it is not routing with the data. So I tried to do it this

   router.goto('mainpage',student,{});

Because I dont want the user to return to the login page but below is the error I got

LOG: InternalError: No router outlet found to handle route: Fuse.Navigation.Route in Fuse.Navigation.Router, Name: router<C:\Users\OMOLEWA\AppData\Local\Fusetools\Packages\Fuse.Navigation\0.43.11$.uno:2804>
LOG: Error: Unable to navigate to route: mainpage?[{“fname”:“Stephen”,“id”:“1”,“matric_no”:“2014235020035”,“password”:“2014235020035”,“surname”:“Omolewa”}]/ in Fuse.Navigation.Router, Name: router<C:\Users\OMOLEWA\AppData\Local\Fusetools\Packages\Fuse.Navigation\0.43.11$.uno:2783>

7

I eagerly await your helping response.

8

Hi,

the error Unable to navigate to route is thrown because your router can not locate a page on the top navigation level that would have a ux:Name="mainpage". Either you simply don’t have one there, or you have it some levels deeper.

Note that push and goto accepts full paths, like so: router.push("mainpage", {}, "subpage1", {}, "subpage2", {});.

9

Thanks for your help. I was able to correct the router but right now the data I sent to the page which are to be retrieved using this.Parameter seems not to hold no value.

             var std_info = this.Parameter;

How can I make this work and how can I get individual values in it so as to use in the current page.

Thanks

10

You’re saying that it holds no value, but you are not showing any of your code that makes you draw the conclusion. How are we expected to help?

this.Parameter is an implicit Observable. As such, it is populated asynchronously, and you MAY NOT access it in procedural style.

var std_info = this.Parameter;
// CAN NOT do this:
// console.log(JSON.stringify(std_info));
// CAN DO this:
var surname = std_info.map(function(x) {
    return x.surname;
});

The surname variable will get the respective value from parameter when its value eventually changes.

I suggest you give a good read the section about Observables.

11

I have done as you have said but the exported data from it are not showing in the UX.
Here is it

       var std_info = this.Parameter;
       var fname = std_info.map(function(x) {return x.fname;});
       var matric_no = std_info.map(function(x) {return x.matric_no;});
       var id = std_info.map(function(x) {return x.id;});
       var surname = std_info.map(function(x) {return x.surname;});
       
       module.exports = {
         fname:fname,
         matric_no:matric_no,
         surname: surname
       }

And here is how I used it in the UX

      <Text Color="White" Margin="12,0,0,12" FontSize="14" Value="{surname} {fname}"/>

But I am not getting the values,they return null.

12

If that is the case, you clearly have done something else wrong. This sure works fine in the Tutorial, doesn’t it?

I would like to help, but without a complete, minimal reproduction that is going to be impossible.

13

Okay, the data I was trying to send is coming from an Sqlite database like this

       function Login(arg){
           var std_matric = arg.data.matric_no.value;
           var std_pass = arg.data.password.value;

          if(std_pass == '' || std_matric == '')
	      debug_log('Enter matric/password');
          else
	      debug_log('Success');
	      var student = db.query('select * from student_info where matric_no = ? and password = ?', std_matric,std_pass);
	      router.goto('home',student);
       }

Viewing the data from the student variable using debug_log(JSON_stringify(student)) return below this:

         [{
            "id":"1",
            "matric_no":"2014235020035","password":"2014235020035",
            "fname":"Stephen","surname":"Omolewa"
        }]

Am I passing the student the right way to the router? Any help on this please?

14

If you say the student variable looks that way, then it is an array that holds a single object. You should instead pass just the object to the other page, so your code should read: router.goto("home", student[0]);.

That, however, presumes that you’ll always get some result back from sqlite, which might not always be the case, so you should add some if/else checking in there.