Iron router issue in meteor application

Question

I am doing my first Meteor application and facing some issues in navigation using the iron router. Everytime, I click the Signin button from the signing template, it doesn't redirect me to home page template. The browser shows a url with a question mark in it after signing button is clicked(http://localhost:3000/?). The weird thing is that after I click the back button in browser, it takes me to home page with URL:http://localhost:3000/home. I am not able to understand why this is happening. Please help me to find what I am doing wrong.

In the router.js file, I have written:

Router.configure({

  layoutTemplate: 'layout',


});



Router.map(function() {


  this.route('/home',function()
  {
        this.render('home');
  });
  this.route('/',function()
  {
        this.render('signin');
  });

});

The layout file looks like this:

<template name="layout">

    <div>
        {{>header}}
    </div>


    <div>
        {{>yield}}
    </div>

    <div>
        {{>footer}}
    </div>

</template>

SignIn template file looks like this:

<template name="signin">

  <div class="container">

    <div class="row">
        <div class="col-sm-6 col-md-4 col-md-offset-4">

            <div class="account-wall">
                <h1 class="text-center login-title">Sign in to continue</h1>
                <form class="form-signin">
                <input type="text" class="form-control" placeholder="Email" required autofocus>
                <input type="password" class="form-control" placeholder="Password" required>
                <button class="btn btn-lg btn-primary btn-block" type="submit">
                    Sign in</button>
                <label class="checkbox pull-left">
                    <input type="checkbox" value="remember-me">
                    Remember me
                </label>
                <a href="#" class="pull-right need-help">Need help? </a><span class="clearfix"></span>
                </form>
            </div>
            <a href="#" class="text-center new-account">Create an account </a>
        </div>
    </div>
</div>


</template>

Home template looks like:

<template name="home">    
        <div class="row">
            <div class="col-sm-4">
                <h3>Column 1</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
            </div>
            <div class="col-sm-4">
                <h3>Column 2</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
            </div>
            <div class="col-sm-4">
                <h3>Column 3</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
                <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
            </div>
        </div>
</template>

The code for Signin.js file is as follow:

if (Meteor.isClient) 
{


    console.log("Sign In JS");

    Template.signin.helpers({

    });

    Template.signin.events({

        'submit': function(event, template) {
           // alert("My button was clicked!");
            Router.go('home');
        }
    });
}

Answer 1

I your case you have to use the path Router.go("/home")