Using history.replaceState with kendo ui Router to add new URL parameter

[Cedric]

I am using kendo ui router and want to replace a URL parameter on each change of the route. So on the change event of the router I have the following code:

 

window.history.replaceState({}, document.title, getUpdatedUrl())

The parameter I want to add is updated successfully, but when I navigate back or forward the kendo ui router no longer catches these events, and does not navigate to the appropriate view (the page URL changes properly). Any ideas how to fix this?

[Boyan Dimitrov]

Hello Cedric,

Have you tried to use the window.location to navigate and load a new page? 

Regards,
Boyan Dimitrov
Telerik by Progress

[Cedric]

Hello Boyan,

Unfortunately this would not work in my case. I do not want to navigate to a new page, but just change the parameter in the URL. The issue I have is that I need the fragment information from the URL to be send to the server (asp mvc) on page refresh, but by default the browsers do not send this information. So I try to manually add it as a parameter, but this does not work when a Router is used. 

Any suggestions?

[Boyan Dimitrov]

Hello Cedric,

The Kendo Router does have its own history. In order to replace the state of a history object the replace method of the Kendo Router should be used to update the router history. Please refer to the http://dojo.telerik.com/edeMa/2 example. 

Regards,
Boyan Dimitrov
Telerik by Progress

[Cedric]

Sadly this does not work for me. What I need is to replace the current url, e.g.  www.somepage.sth?param=1#/foo, with another one which has one additional parameter -  www.somepage.sth?param=1&newParam=foo#/foo

The router.replace function "normalizes" the string to only get the fragment, so in practice it will just replace the fragment part (i.e. #/foo).

What I want to do is to pass the fragment part of the url (#/foo) to the server on page refresh, but only parameters are passed to the server (running asp mvc), so on each change of the router I want to add the information as parameter, I can change the url with history.replaceState, but the router navigation does not work properly after that.

[Boyan Dimitrov]

Hello Cedric,

I am sorry to hear that the replace method of the router does not work for your case. 

The only solution left is to enable the pushState option of the Kendo UI Router. When it is enabled the router will use the history pushState API. Unfortunately as stated in the article the history pushState API currently has limited support across current browsers.

Regards,
Boyan Dimitrov
Telerik by Progress