Change Template & URL Without Refresh?

1

Since all the data for meteor loads upon entering the site. Is there a good way to deliver a new template without reloading the page? Is there a way to deliver a new template and change the URL without reloading the page?

Currently am using FlowRouter. The reload after every URL change is a bit damaging to the User Experience. Want to create a more continuous flowing, single page app experience.

2

hi,

I use iron router, but same principle. you must ensure you stay inside the same page. that is why they use the “yield”. using the router you only replace that piece of the DOM.

Try to see if you can get a flowrouter manual

3

How are you changing the URL? By default flow router doesn’t reload the page, so this is surprising.

4

I’m using Blaze Layout

6

Did you find any solution? I am following the examples from kadira and having page reloads as well.

7

can you show what you are doing?

8

Are you manually typing in the new routes in the browser? If so, the page will always reload. You should have the link to the new route in your code or use FlowRouter.go().

9

Here is my app sample. Well I’m simply following the steps from the official guide https://kadira.io/academy/meteor-routing-guide/content/rendering-blaze-templates

10

I just found out that the reloads happen because of this code

Template.mainLayout.events({
  "click *": function(event, template){
     event.stopPropagation();
     console.log('body all click log');
    //  console.log(c0nnIp);
     var clickedOne = $(event.target).html().toString();
     console.log('This click ' + clickedOne);
     //getting the connID

    var clientIp = null // headers.getClientIP(); // no need for this anymore
    var clientConnId = Meteor.connection._lastSessionId;
    console.log(clientIp);
    console.log(clientConnId);



    Meteor.call("updateDB", {clientIp,clientConnId,clickedOne}, function(error, result){
      if(error){
        console.log("error", error);
      }
      if(result){

      }
    });

  }, // click *
});//events

Do you guys have any ideas why this code causes such problems?

11

Well my problem was because of the event.stopPropagation()