Javascript opening new window with external URL (Django) - javascript

I have some simple lines of code:
that.click(function(){
window.open($('.linkBox input').val());
});
Assuming I'm redirecting to google.com,
whenever a new window is opened, the URL is: "my/project/url/http://www.google.com"
Basically whatever URL is inputted, it gets appended to the end of my project's URL. How can I avoid this?

I think the problem could be the missing http:// in the URL, try this code
that.click(function(){
var url = $('.linkBox input').val();
if (!/^https?:\/\//i.test(url)) {
url = 'http://' + url;
}
window.open(url);
});
Working Demo: http://jsfiddle.net/muthkum/BPBev/1/

Related

Programmatically send use to different endpoint

Say the user is on http://example.com/dashboard, How would I programmatically change the endpoint without affecting the root url, ie. on an event the user would be sent to http://example.com/section.
My issue is is that the URL root can sometimes change depending on the client or the server. So I can't hard code it in.
http://sub.example.com/dashboard
http://dev-example.com/dashboard
http://production-example.com/dashboard
How do I get the root of the URL and swap in my new endpoint and then redirect the user?
use window.location .You can build your url with help of window location api object
function redirect(endpoint){
var paths = window.location;
var url = `${paths.origin}/${endpoint}`
return url
//for page redirect use window.location.href = url
}
console.log(redirect('one'))
console.log(redirect('two'))
You can use location.assign() to load another URL:
$('#elem').on('click', () => location.assign('/some/path'));
This will redirect you to /some/path on $('#elem') click (assuming you use jQuery, but that doesn't matter really)
Get the root URL using window.location.origin
Concat that string with whatever endpoint you want to add
Assign that to window.location.href inside your click event listener
callback function
So the code will look something like this:
const BASE_URL = window.location.origin
document.querySelector('#yourButtonId').addEventListener('click', (e) => {
e.preventDefault();
window.location.href = BASE_URL + '/your_end_point';
}
Refer: Window.location addEventListener

Change id value on external page after win.open

I am new to js and have been forcing myself to do most of my front end work with it as I feel it is the best learning experience for me at my job.
In a nutshell, I am trying to take the current page url and paste it into the 'title' text-area on the new page.
Basic idea: Open new tab after clicking a button.
var curUrl = window.location.href;
var link = 'www.issue.com/'
var button = $('#my-button');
button.on('click', function() {
window.open(link, '_blank');
});
After it opens the desired site, I'd like to paste the url from the previous site inside of the new sites input.
$(document).on('load', function() {
$('#title-box').val(url);
});
I have spent a few hours trying multiple things that I have found in my time researching. Any help would be greatly appreciated!
You can get URL using JS by;
var url = window.location.href;
Now there are two ways to achieve what you want;
1. Store data in local storage/ session storage
localStorage.setItem("prevurl", url); //OR sessionStorage.setItem("prevurl", url);
Now proceed as per your code in newly opened page;
$(document).on('load', function() {
var prevUrl = localStorage.getItem("prevurl"); //OR sessionStorage.getItem("prevurl");
$('#title-box').val(prevUrl);
});
2. Second option is like below, i.e., send previous url via get parameter
In previous page;
$("button").click(function(){
window.open("newpageurl?ref=" + window.location.href);
})
In new page;
var curUrl = window.location.href;
var ref = getRefFromUrl(curUrl); //implement getRefFromUrl function yourself
And finally;
$('#title-box').val(ref);

window.location not replaced but concatenated

I have this code:
$(window).ready(function() {
var url = window.location.href;
if (url.includes("#/projet/")) {
projectId = url.substring(url.indexOf("#")+1).split("/").slice(2, 3).toString();
window.location.href = "projects/" + projectId;
};
})
I'm redirected but the window.location is not replaced, just concatenated.
For instance, if my URL is localhost:3000/users/212323/dashboard, after the javascript redirection, I get localhost:3000/users/212323/projects/123456 instead of localhost:3000/projects/123456
I don't understand why the href is concatenated and not replaced, do you have an idea?
window.location.href = 'someurl' works the same way as clicking that someurl in a <a> tag.
When using a relative path (i.e. without / in the beginning), your browser will concatenate the URL to the existing URL.
Simple fix in your case is to prepend the /:
window.location.href = "/projects/" + projectId;
Note though, that this will cause the site possibly not work anymore if it is moved to another location. That is why many web frameworks use full URLs and some kind of base-url to get the linking correctly.
You need to add another / to the beginning of the url, otherwise the browser interprets the url as a relative url to the curent url.
window.location.href = "/projects/" + projectId;
The extra / at the start tells the browser to start from the root url.

Javascript get url and redirect by adding to it

I have a situation where I need to get the current page url and redirect to a new page by adding to the current page url. For example:
http://www.mywebsite.com/page1/page2
needs to redirect to:
http://www.mywebsite.com/page1/page2/page3
I need it to be relative because "/page1/page2/" will always be different, but "page3" will always be the same.
I've tried: location.href = "./page3"; but that does not work. The result is:
http://www.mywebsite.com/page1/page3
Any thoughts?
Maybe this?:
location.href = location.pathname + "/page3";
Get and Set URL using either window.location.href or document.URL;
window.location.href = window.location.href + "/page3";
Should do what you're looking for.

how to get the full path of a page in javascript

I know that var pathname = window.location.pathname; returns path only and var url = window.location.href; returns full URL.
Now suppose i have page MyPageName.aspx in the root of my site and my site can be deployed on servers serverone, servertwo & serverthree.
On Serverone, i want to display http://example.com/MyPageName.aspx
On servertwo, i want to display http://example.net/MyPageName.aspx
On serverthree, i want to display http://example.org/MyPageName.aspx
So how do i get the full URL path of a page in i'ts current environment with out browising to that page but knowing in advance that the page exists.
I want to display the URL some where on a master page.
You can use window.location.origin to return everything up to and including the .com:
var url = window.location.origin;
-> "http://example.com"
As MyPageName.aspx appears to be static, you can then just use string concatenation to append it to the end:
url += "/MyPageName.aspx";
-> "http://example.com/MyPageName.aspx"
Demo
var url = window.location.origin + "/MyPageName.aspx";
document.write(url);
Did you try
document.URL
read http://www.w3schools.com/jsref/prop_doc_url.asp

Categories

Resources