window.open with target '_blank' opens a new browser window

2
votes

I am trying to open an link in new browser tab (not in new window).

When I place an link on page like

<a href="#" onclick="window.open('http://www.google.com', '_blank');"> Click Here</a>

when user click on link it will open google in new browser tab. That's fine

BUT

$.ajax({
   type: "POST",
   url: someURL,
   data: {somedata},
   contentType: "application/json; charset=utf-8",
   dataType: "json",
   success: function (response) {
    window.open('http://www.google.com', '_blank'); // it's always open in new browser window and I want a new tab
   },
   failure: function (response) {
      alert(response);
      return;
   }
});

When I try this within an AJAX web method, it always opens it in new browser window; but I want to open it in new tab as it's working for above example.

I understand this is browser specific functionality but somehow I need to accomplish this.

3
javascriptjquerybrowserhyperlink
which browser you are using? - Anoop Joshi
Mostly Chrome, but our users may be using, IE 9+, FireFox, Safari... - nrsharma
var newWindow = window.open("","_blank"); declare this out of that function and then at the after success of ajax newWindow.location.href = newURL try that if succeed i want to post it as answer ;) - Just code
possible duplicate of Open a URL in a new tab using JavaScript - Dávid Szabó
add href="javascript:void(0);" on "a" tag + @Justcode answer works like charm - Abdul

3 Answers

1
votes

try this

onclick="window.open('http://www.google.com', '_self');
0
votes

well it is browser specific, i tested it on mozilla and is working fine, but on chrome it open in new browser window. You can suggest to chrome makers or call ajax synchronus.

use async:false will work.

NOTE: In IE, open new browser window is default behaviour. user need to set settings explicitly

0
votes

You have to play a little trick here. You have to create a hidden a link tag with target='_blank' and set the href of this link tag on ajax success and then trigger the click of this link tag for eg.

HTML code

<a href="#" id="hidden_link" target="_blank">hidden</a>

Js code

$.ajax({
  type: "POST",
  url: someURL,
  data: {somedata},
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function (response) {
   var hiddenLink = $("hidden_link");
   hiddenLink.attr("href",response.href);
   hiddenLink[0].click();  
  },
  failure: function (response) {
    alert(response);
    return;
  }
 });

Here is the working fiddle for above code