document.location not yet updated in route callback

[Jack]

The problem
I need to implement Google CSE when navigating the /search?q=query route.
I navigate form the search input box to the search result page as follows:

router.navigate('/search + '?q=' + encodeURIComponent($('#search-input').value()));

I would like to implement my callback as follows:

router.route('/search', function() {
  applicationLayout.showIn('#search-view', searchView);
  $('#search-results').html('<gcse:searchresults-only></gcse:searchresults-only>');
  var script = (document.location.protocol === 'https:' ? 'https:' : 'http:') +
       '//www.google.com/cse/cse.js?cx=003237445845897440411%3Atuurehzakfu';
  $.getScript(script);
});

The Google script parses document.location to find the q param and display the results.
Unfortunately, at this stage (callback) the q param is not yet available in document.location.href.
There is no event that triggers after document.location.href is updated and the only way to get it work is to replace router.nivigate by window.location.assign or to use setTimeout.

How it should have been designed (IMHO)
document.location.href should already have been updated with the new route when the route callback function is triggered otherwise router.navigate should be banned when using any api that analyzes the query string.

[Petyo]

Hello Jacques,

thank you for your feedback. The reason for this is because the routing callback may prevent the actual URL change by calling e.preventDefault(). Thus being said, you can use the hashchange/popstate DOM events, which are triggered after the URL has been updated. 

Regards,
Petyo
Telerik

[Jack]

The workaround I use is window.location.assign instead of router.navigate (which I no more use).
It is also consistent with links like "#/view" in anchors.
In both cases the router change event is triggered after the address bar is updated.

[Petyo]

Hi Jacques,

Correct, this is also a solution. Simply put, this will work in exactly the same manner as the router handling of link elements clicks.

Regards,
Petyo
Telerik