Execute a function after changing location.href - javascript

I want to call a function after redirecting the page.
Inside my function I put a parameter which is an ID but when I check the console it wont display. I know I can be able to run it via on click event but I wont get the ID param from the previous page.
Is there a way to get it done?
Code:
function encode(item_id){
$('.js-encode').click(function(){
var url = $(this).data('url');
location.href = url; // new url
save(item_id); // call function after new url finish loading
});
}
function save(item_id){
console.log(item_id); // check if there's item_id exists
}

I agree with Katana's comment. Anything after your redirect statement will not run because the page itself is redirecting. One way that I would suggest to still get the item_id and get around that barrier, would be to include the item_id in the redirect url as a parameter. Then once on the new page, parse that parameter out of the url and save the item_id.
A great example from Cory Laviska's article on Parsing URLs in Javascript, shows how you can get the individual parameters from a URL.
Building onto Manish' answer:
Function on the current page:
function encode(item_id){
$('.js-encode').click(function(){
var url = $(this).data('url');
location.href = url+'?saved_item_id='+item_id; // new url
});
}
Function on the REDIRECTED Page (assuming you only have one parameter)
$( document ).ready(function() {
var url = $(this).data('url');
var item_id = url.queryKey['saved_item_id'];
save(item_id);
});
It may need a few tweeks because I didn't test the code, but hopefully it'll get you on the right track. :)
Hopefully this helps. If it helps and/or answers your question, please select as answer and up vote! :D Feel free to let me know if you have any questions

Try this one
The container is the section of your page where you perform an action.
function encode(item_id){
$('.js-encode').click(function(){
var url = $(this).data('url');
$("#container").load(url,function(){
// other stuffs and functionalities
save(item_id); // call function after new url finish loading
});
});
}

You can try something like this.
function encode(item_id){
$('.js-encode').click(function(){
var url = $(this).data('url');
location.href = url+'?saved_item_id='+item_id; // new url
//save(item_id); // call function after new url finish loading
});
}
/*(function save(item_id){
console.log(item_id); // check if there's item_id exists
}*/
Further more , On New redirected URL you can get item_id which was appended to URL in previous page.
Hope this may help.

Related

How can I trigger this function from the URL?

I have this Javascript on my homepage which opens a popup.
I need a way to create a URL which then opens the popup immediately.
I've read on other posts that I need to use parameters and then add something like ?parameter=true to the url. The problem is I don't know javascript.
Can anyone help me with adding parameters to my js code?
jQuery(document).ready(function() {
$("#customButton").click(function () { $("#crazyrocket-launch-icon").trigger("click") });
});
You can use searchParams.Get() to grab the value of the parameter from the URL. You can then run your function on document ready after checking with an if statement.
var url_string = "http://www.example.com/t.html?popup=true";
var url = new URL(url_string);
var popup = url.searchParams.get("popup");
jQuery(document).ready(function() {
if (popup) {
$("#crazyrocket-launch-icon").trigger("click");
}
});

js ecwid url redirect

I have been trying to set up redirects for a range of ecwid urls starting from /shop to /shop#!/~/ to lead to /shop#!/~/cart
I have come up with this code:
var wrong_url = ['http://example.com/shop','http://example.com/shop#','http://example.com/shop#!','http://example.com/shop#!/','http://example.com/shop#!/~','http://example.com/shop#!/~/'];
var current_url = document.URL;
for (i=0;i<wrong_url.length;i++) {
if (current_url==wrong_url[i]) {
document.location.replace('http://example.com/shop#!/~/cart');
break;
}
}
It works all right but there is a problem. When I am at /shop#!/~/cart and then manually change url to, say, /shop#!/~/ it won't get redirected until I refresh the page. I believe this has something to do with ajax behavior of ecwid shopping cart but can't figure out how to fight it.
Need help?
Vitaly from Ecwid here.
The issue in the current version of your script is that it doesn't detect the changes to the URL like you described.
So you will need to create a handler for such situations separately. For example, you can do it like this:
<script>
var wrong_url = ['http://example.com/shop','http://example.com/shop#','http://example.com/shop#!','http://example.com/shop#!/','http://example.com/shop#!/~','http://example.com/shop#!/~/'];
var current_url = document.URL;
// function to check current URL and make a redirect
function checkUrl(){
for (i=0;i<wrong_url.length;i++) {
if (current_url==wrong_url[i]) {
document.location.replace('http://example.com/shop#!/~/cart');
break;
}
}
}
// Execute checkUrl() function each time URL is changed
$(window).bind('hashchange', function() {
checkUrl();
});
// Execute checkUrl() function on initial page load
checkUrl();
</script>

location.href could not load new location?

I need to redirect to new location when a button is clicked. I have used location.href=newloactionname.aspx but it doesn't move to new location. My code is:
function OpenUser(userID) {
location.href = 'UserRegistration.aspx?userID=' + userID;
alert(location.href)//shows only previous location
}
you can try:
window.location = 'UserRegistration.aspx?userID=' + userID;
instead...
See first if you have any javasript errors. Maybe your code does not calling OpenUser function.
Also try this:
//link click
window.location.href = "https://stackoverflow.com/";
OR
// HTTP redirect
window.location.replace("https://stackoverflow.com/");
I almost sure that you have an JS error somewhere. Press F12 on your browser.
Put an alert on the function. See if the alert appears.

JavaScript Page Not Redirecting Properly

I'm trying to create a page system for user_profile.html using a parameter from the URL and accessing using JavaScript.
However, for some reason my page does not refresh using the # parameter. I'm not sure why this is happening. I've put my redirection function and the output below.
Code:
function pageRedirect(page) {
var url = window.location.href.replace('#'+window.location.hash.substr(1), '#'+page);
console.log("####");
console.log(url);
console.log("####");
window.location.href = url;
}
Chrome console output:
####
user_profile.js:296 http://**********/user_profile.html#1
user_profile.js:297 ####
Navigated to http://**********/user_profile.html
Even though the URL gets changed to the same thing with a #1 at the end it does not get refreshed with that parameter.
The simplest way to change the hash of an url will be :
window.location.hash = page; // not the URL, just the '#something' part without the '#'
And if you need to reload the page after this, you can do this :
window.location.reload();

How do I return part of the url using window.location.hash

I am really stuck
I am currently using the code below to add the name of a dynamically loaded page to the url
var value = $(this).attr('href');
e.preventDefault();
window.location.hash = value;
it almost works as its returning this in the url
http://www.sitename.com/dev888/#http://www.sitename.com/dev888/page-name
But I the only want part of the url to return like the example below
http://www.sitename.com/dev888/#/page-name
How can I edit the code above to get my desired result?
Thank!!
You can play with the value to get the last one like this
var value = $(this).attr('href');
e.preventDefault();
var parts = value.split("/");
value = parts[parts.length-1];
window.location.hash = value;
Or you can change the attr('href') to the value you want directly :)
I hope this can help
And you may want to take a look at pusState
https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history
The browser already does this for you. Just make your link's href the hash, and let the user click it normally:
Click!
It will automatically append #my-hash to the URL.
Trying to accomplish this with JavaScript is totally wrong, unless you require logic to prevent the click under certain conditions, and even then the correct behaviour is to specify your hash as the href of the link, conditionally allowing the click event to be handled by the browser.
Maybe you find interesting to obtain the title of the page and use it in the hash
var current_title = $(document).attr('title');
e.preventDefault();
window.location.hash = current_title ;

Categories

Resources