How to Replace the path name of URL using JavaScript/jQuery? - javascript

I am trying to replace the url and load the page.
Example:
URL: http://www.example.com/account/edit
I want to replace this as http://www.example.com/account/add. And load this page.
For that, I tried by using location.pathname.
location.pathname = "/account/add";
When using like above, the add page is displayed. But after that, URL http://www.example.com/account/add is loading. Then the add page is not displayed. I get that page is not found message.
The host name should vary based on running the project. So I want to resolve this without based on host name.
How can I achieve it?

If you want to retain the page in your session history (meaning you want to be able to use the back button to it) use the assign method. Otherwise, you replace.
Replace the current document with the one at the provided URL. The difference from the assign() method is that after using replace() the current page will not be saved in session history, meaning the user won't be able to use the Back button to navigate to it.
http://mdn.beonex.com/en/DOM/window.location.html

window.location.href = "http://www.example.com/account/add";
OR
window.location.replace("http://www.example.com/account/add");
This will redirect to the new page.

Actually you can change your url some other ways like below:
window.location.assign("http://www.mozilla.org"); // or
window.location = "http://www.mozilla.org";

Related

How can i save the href value after a link has been clicked

More specifically a client has asked that when their link on another site has been clicked, and the user is brought back to the clients site. Can the href value of the users clicked link be saved and used again in another function.
For ex. I clicked the clients logo on another site and it brought to the clients site. Now the content on the clients site is filtered based on where i came from.
I found the following which saves the href of a clicked link on current site.
$(document).ready(function(){
$('a').click(function() {
if ($(this).attr('href')) someFunction.href = $(this).attr('href');
});
});
function someFunction(a) {
window.setTimeout("console.log(someFunction.href);",200);
But im not sure how to store that data and use it again.
If you have access to the "other" site, I'd recommend just attaching a query parameter to the link, such as: Client site. That's a very easy and dependable way to go at it.
Another way would be server-side, using $_SERVER\['HTTP_REFERER'\]
If you want to access it client-side, you can use document.referrer.
Note that the last two (especially the client-side) are not as dependable, though you should generally be fine. Also note that document.referrer will be empty if the parent site is HTTPS and the target site is HTTP.
Example
jQuery(document).ready(function($){
if(document.referrer === 'http://www.affiliatesite.com/product/myproduct')
filterMyContent('affiliate')
});
I think what you're looking for is query string parameters. For example, if the link to your clients site that was clicked from elsewhere were myclientsite.com?from=google.com, you could parse that value (from=google.com) and use it to change content on your clients page. See https://davidwalsh.name/query-string-javascript for details on parsing these values with javascript. This only works with the caveat that you can control the url of the link on the external site.
If you are able to set the link on the other site you could add a query string to the URL e.g. clientsite.com?referrer=othersite.com. Then change the site based on the referrer.
If you can't change the link on the other site you could try see where the user has come from using the referrer (although this isn't always very reliable)
//Javascript
var referrer = document.referrer;
//PHP
$referrer = $_SERVER['HTTP_REFERER'];

How to change the omni-bars value without changing the website? Javascript

I just wanted to know is there any way to change the omni-bars value without redirecting to another page using javascript? Maybe something like omni.value = "changed.net"
window.history.pushState(null, null, "/google.com");
This will change the url without reloading the page. If you did that in the console now the url would change to http://stackoverflow.com/google.com. You can only change the url from the web root. So you can't make it look like a user is at google.com itself.

Javascript change query string for refresh

I am looking for a way to alter the get query string of an html request using javascript (jquery included) without refreshing the page. This query string would be carried over when refresh. For instance, http://thissite.site/index.html?id=123 would be the original url, then an event happens and id changes to 235. When the page is refreshed, the refreshed link would be http://thissite.site/index.html?id=235.
window.location.search = "?id=" + encodeURIComponent(new_value)
https://developer.mozilla.org/docs/DOM/window.location
https://developer.mozilla.org/docs/JavaScript/Reference/Global_Objects/encodeURIComponent
With HTML 5 you can use the the following pushState function. More info found on How does pushState protect against potential content forgeries?.
I was looking for this as well and saw bandcamp using this for the navigation on http://bandcamp.com/discover

How can I reload the entire page when only the url hash changes?

How do I reload a page if the only change to the url is a hash? location.href doesn't work as I expect.
location.href= siteUrl + '#T_blockName';
This doesn't refresh the page unless I change siteUrl. How is it possible?
You need to use location.hash. This retrieves the hash. To change it, you need to use an anchor or set window.location to the location plus the hash you want.
Also, you are using PHP concatenation syntax when you should be using +.
Its possible because simply changing the hash part isn't going to request a page reload since hash is usually considered to be part of the page (anchor, id etc.).
You need to specifically request a page reload but how you are going to do it depends on what you are actually trying to achieve.
That is not how you concatenate strings in javascript, you need to use + instead of ..
location.href= CURRENT_SITE_URL + '#T_blockName';

Update URL parameter with javascript, without ruining the history?

I'm looking for a way to update the url in the status bar..
I have a gallery, and when you click your way through the gallery I want the image ID to show up in the URL, so that the user can link directly to the image..
I've read about using hash and so. but as far as I've tried it, that "ruins" the history.
If I click the back-button in my browser the previous image would be shown.
Is it possible to add or update a URL parameter, without ruining the history?
Thanks in advance
Use location.replace to replace the current location:
Replace the current document with the one at the provided URL. The difference from the assign() method is that after using replace() the current page will not be saved in session history, meaning the user won't be able to use the Back button to navigate to it.
Do it simply this way, when switching to images, add a hash to the url, for example:
location+='#image-'+image_id
your location will become
http://example.org/images/#image-3
instead of the initial
http://example.org/images/
and onload, check if location.hash is not empty, and matches with ^image-(\d+)$ (regular expression pattern), if it matches, do the usual thing you'd have done if a user clicks on image with id (\d+).
To preserve history, use reallysimplehistory.

Categories

Resources