Develop Reference

Can't redirect to url by javascript function

I need a button, which lead up in url path like this:
from /host/elements/1
to /host/elements
I have a link in my html:
And a javascript function:
function go_backward() {
var url = window.location.href;
var page = url.substring(0, url.lastIndexOf('/'))
window.location.assign(page);
return false;
}
But when i click the button i only get desired url printed, without correct redirect.
Why cat it be so?

Change:
window.location.assign(page);
return false;
to
window.location.href = page;
If you just want to go back you can also use:
window.history.go(-1)

Infinite loop when redirecting in Javascript

I have a sample page, let' say testpage.pl When I choose English version, GET parameter is added to URL, like /?language=en.
Afterwards, when I click menu positions, they are in the English version so everything is OK.
But if I want to have English version of a subpage directlty after pasting URL in a browser, like
http://testpage.pl/wyjazdy-i-przyjazdy/erasmus-incoming-staff/accommodation.html)
the Polish version is opened. So I've made a simple redirect function like below, but it comes to the loop after first start. This function redirect to the same page, but before it tries to redirect to this first URL with GET parameter ?language=en
How to solve this?
function cleanUrl() {
window.location = "http://testpage.pl/?language=en";
var cleanedUrl = "http://testpage.pl/wyjazdy-i-przyjazdy/erasmus-incoming-staff/accommodation.html";
var currentUrl = window.location.href;
if (currentUrl !== cleanedUrl) {
window.location = cleanedUrl;
}
}
cleanUrl();

Your are updating url in first line of function which is causing your code to loop infinite. Remove that line or move to some other function for fix
function cleanUrl() {
var cleanedUrl = "http://testpage.pl/wyjazdy-i-przyjazdy/erasmus-incoming-staff/accommodation.html";
var currentUrl = "http://testpage.pl/?language=en";
if (currentUrl !== cleanedUrl) {
window.location = cleanedUrl;
}
}
cleanUrl();

Keep the window.location assignment as last operation.
function cleanUrl() {
var enUrl = "http://testpage.pl/?language=en";
var cleanedUrl = "http://testpage.pl/wyjazdy-i-przyjazdy/erasmus-incoming-staff/accommodation.html";
var currentUrl = window.location.href;
if( currentUrl !== cleanedUrl ) { enUrl = cleanedUrl; }
window.location = enUrl;
}

replacing and adding 3 different params to the url

I have a script that adds an param to the url when I click the assigned button - next click replaces it with a new param - this work great.
However - now I have three buttons - and I want each button to assign a param to the url - and replacing any params added by any of the other buttons. It also needs to be placed last behind the params that are already there.
so:
(button1) click3: /m4n?ecom-query=imac&seid=etailer-products&viewMode=3?param=grid
(button2) click4: /m4n?ecom-query=imac&seid=etailer-products&viewMode=3?param=list
(button3) click5: /m4n?ecom-query=imac&seid=etailer-products&viewMode=3?param=smalllist
The url before ?param is dynamic and can look different.
$('.click2').on('click', function() {
console.log("Clicked");
var url = window.location.pathname;
var url = window.location.href;
if (url.indexOf('?param=list') > -1) {
url = url.replace("?param=list", "") + '?param=grid'
} else {
url = url.replace("?param=grid", "") + '?param=list'
}
window.location.href = url;
});
How do I do this, I tried to modify my existing script but had no luck.

I think there is a small error in your approach:
All parameters in url should be connected with an &
so now your url should look like that
/m4n?ecom-query=imac&seid=etailer-products&viewMode=3&param=grid
now if you want to replace old pram, you need to remove the old value also. For that you can use regex as in following code
url = url.replace(/\&param=.*/,'') + '&param=list'
So the full code would be:
$('.click2').on('click', function() {
console.log("click2 Clicked");
var url = window.location.href;
url = url.replace(/\&param=.*/,'') + '&param=list';
window.location.href = url;
});
Hope it helps

How to reload page once only without repeating loading

I have the following code to reload page only once after submitting some data using JQuery.
code to reload page :
update: the url here is not ending with '?' because it has parameter value
for example: http://localhost:49208/UserView.aspx?id=12
var url = window.location.href;
if (url.indexOf('?') > -1)
{
window.location.href = url;
}
The problem here is that page reloading does not stop?

The reason it won't stop reloading is because you aren't changing the conditions of the url; so if the if statement is ever true, it will happen again and again.
If you want to reload the page, just use window.location.reload();

Try this logic.
if (url.indexOf('?') == -1) {
url = url + '?';
location = '?';
location.reload(true);
}

Easiest way is to add a flag variable so that javascript can check whether the page is reloaded previously.
var url = window.location.href; // get the current url of page into variable
if (url.indexOf('?') > -1) { // url has a '?'
if(url.indexOf('reloaded') < 0){ // url does not have the text 'reloaded'
url = url + "&reloaded=true"; // add the word 'reloaded' to url
window.location = url; // "reload" the page
}
}

If you want to reload the page only once, use the following method:
if(!window.location.hash) {
window.location = window.location + '#loaded';
window.location.reload();
}

if(!window.location.hash)
{
window.location = window.location + '#loaded';
window.location.reload();
}

How to force a page to reload if all what was changed in url is hash?

I am trying to reload current page with different url hash, but it doesn't work as expected.
(Clarification how I want it to work: Reload the page and then scroll to the new hash.)
Approach #1:
window.location.hash = "#" + newhash;
Only scrolls to this anchor without reloading the page.
Approach #2:
window.location.hash = "#" + newhash;
window.location.reload(true);
Kinda works but it first scrolls to the anchor, then reloads the page, then scrolls to the anchor again.
Approach #3:
window.location.href = window.location.pathname + window.location.search + "&random=" + Math.round(Math.random()*100000) + "#" + newhash;
Works but I would rather not add random garbage to the url.
Is there a better solution?

Remove the anchor you're going to navigate to, then use approach #2? Since there's no anchor, setting the hash shouldn't scroll the page.

I had a JQuery function that fired on $(document).ready() which detected if there was a hash appended to the URL in my case, so I kept that function the same and then just used a force reload whenever a hash change was detected:
$(window).on('hashchange',function(){
window.location.reload(true);
});
Then my other function -
$(document).ready(function() {
var hash = window.location.hash;
if(hash) {
//DO STUFF I WANT TO DO WITH HASHES
}
});
In my case, it was fine for UX -- might not be good for others.

It should be expected that #foo will scroll to the anchor of the id, "foo". If you want to use approach #1 and have it reload, this approach might work.
if (Object.defineProperty && Object.getOwnPropertyDescriptor) { // ES5
var hashDescriptor = Object.getOwnPropertyDescriptor(location, "hash"),
hashSetter = hashDescriptor.set;
hashDescriptor.set = function (hash) {
hashSetter.call(location, hash);
location.reload(true);
};
Object.defineProperty(location, "hash", hashDescriptor);
} else if (location.__lookupSetter__ && location.__defineSetter__) { // JS
var hashSetter = location.__lookupSetter__("hash");
location.__defineSetter__("hash", function (hash) {
hashSetter.call(location, hash);
location.reload(true)
});
}

Another option is to remove the hash and store it in session storage to be retrieved on reload:
var newUrl = location.href + '#myHash';
var splitUrl = newUrl.split('#');
newUrl = splitUrl[0];
if (splitUrl[1]){
sessionStorage.savedHash = splitUrl[1];
}
location.href = newUrl;
and then on top of your page you can have the following code:
var savedHash = sessionStorage.savedHash;
if (savedHash){
delete sessionStorage.savedHash;
location.hash = savedHash;
}