Change URL and redirect using jQuery

JavascriptJqueryUrlRedirect

Javascript Problem Overview


I have some code like this,

<form id="abc">
  <input type="text" id="txt" />
</form>

and now I want to redirect like this,

var temp = $("#txt").val();
url = "http://example.com/" + temp;
window.location.replace(url);
// or window.location(url);

Is there anyway in jQuery to solve this? It still lets me have url = http://example.com.

Javascript Solutions


Solution 1 - Javascript

As mentioned in the other answers, you don't need jQuery to do this; you can just use the standard properties.

However, it seems you don't seem to know the difference between window.location.replace(url) and window.location = url.

  1. window.location.replace(url) replaces the current location in the address bar by a new one. The page that was calling the function, won't be included in the browser history. Therefore, on the new location, clicking the back button in your browser would make you go back to the page you were viewing before you visited the document containing the redirecting JavaScript.
  2. window.location = url redirects to the new location. On this new page, the back button in your browser would point to the original page containing the redirecting JavaScript.

Of course, both have their use cases, but it seems to me like in this case you should stick with the latter.

P.S.: You probably forgot two slashes after http: on line 2 of your JavaScript:

url = "http://abc.com/" + temp;

Solution 2 - Javascript

tell you the true, I still don't get what you need, but

window.location(url);

should be

window.location = url;

a search on window.location reference will tell you that.

Solution 3 - Javascript

jQuery does not have an option for this, nor should it have one. This is perfectly valid javascript and there is no reason for jQuery to provide wrapper functions for this.

jQuery is just a library on top of javascript, even if you use jQuery you can still use normal javascript.

Btw window.location is not a function but a property which you should set like this:

window.location = url;

Solution 4 - Javascript

var temp="/yourapp/";
$(location).attr('href','http://abcd.com'+temp);
 

Try this... used as an alternative

Solution 5 - Javascript

Try this...

$("#abc").attr("action", "/yourapp/" + temp).submit();

What it means:

Find a form with id "abc", change it's attribute named "action" and then submit it...

This works for me... !!!

Solution 6 - Javascript

If you really want to do this with jQuery (why?) you should get the DOM window.location object to use its functions:

$(window.location)[0].replace("https://www.google.it");

Note that [0] says to jQuery to use directly the DOM object and not the $(window.location) jQuery object incapsulating the DOM object.

Solution 7 - Javascript

You can do it like:

var url = "http://example.com/" + temp;
$(location).attr('href',url);

Solution 8 - Javascript

you can do it simpler without jquery

location = "https://example.com/" + txt.value

function send() {
  location = "https://example.com/" + txt.value;
}

<form id="abc">
  <input type="text" id="txt" />
</form>

<button onclick="send()">Send</button>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestiongaconView Question on Stackoverflow
Solution 1 - JavascriptMathias BynensView Answer on Stackoverflow
Solution 2 - JavascriptbalexandreView Answer on Stackoverflow
Solution 3 - JavascriptPim JagerView Answer on Stackoverflow
Solution 4 - Javascriptuser2389005View Answer on Stackoverflow
Solution 5 - JavascriptamouatView Answer on Stackoverflow
Solution 6 - JavascriptAdriano G. V. EspositoView Answer on Stackoverflow
Solution 7 - JavascriptAkhilesh shuklaView Answer on Stackoverflow
Solution 8 - JavascriptKamil KiełczewskiView Answer on Stackoverflow