Is it possible to use jQuery on a new window?

Question

I've been trying to solve this problem for hours now maybe anyone of you could help me.

Right now my Code looks like this:

$('.clickable').on('click', function() {
  var id = $(this).attr('data-packages');
  id = "'" + id + "'";
  $.ajax({
    url: "show.php",
    data: {
      type: "showSFM",
      data: id,
      user: username
    },
    type: "POST",
    success: function(data) {
      $('#main').html(data);
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Everything is working fine but I was asking myself If it is possible to use $('#main').html(data) on a new Window. Right now if I click an Element the current window is showing the result but I want a new tab to pop up with the result.

I was trying things like this:

success: function(data) {
  var url = location.href;
  var window = window.open(url);
  window.document.getElementById('main').innerHTML = data;
}

The result I'm getting is that the window opens on the main page. Looks like window.open(url) works just fine but the line below does nothing.

If that's what you want, why not use a normal form submit, or link, that targets a new page? — Taplar, Mar 19 '19 at 12:56
A normal link is not working in this case due to the way the website is coded. I need a new tab to open and change the content of the new page. Is there any way to do this? — rdlgi, Mar 19 '19 at 13:14
What is the result you're getting? Does a window open? Is content not loaded? — 3limin4t0r, Mar 19 '19 at 13:25
The result Im getting is that the window opens on the main page. Looks like window.open(url) works just fine but the line below does nothing. — rdlgi, Mar 19 '19 at 13:40
Possible duplicate of [Jquery post, response in new window](https://stackoverflow.com/questions/3825078/jquery-post-response-in-new-window) — Ben Sewards, Mar 19 '19 at 14:38

score 0 · Answer 1 · answered Mar 19 '19 at 14:28

0

You can send the data you need for the request in the URL and then on the new page, you can send the AJAX request again, and getting the data you need for it from the URL.

answered Mar 19 '19 at 14:28

Bojan Ivanac

1,170
8
17

3limin4t0r · Accepted Answer · 2019-03-19T15:03:02.623

0

The reason this likely doesn't work is due to the fact that you use:

window.document.getElementById('main')

The window might already be opened by the line before, but is most likely not loaded and doesn't contain an element with id main yet (since making a HTTP(S) request takes time). This could be solved by moving the filling of main element into a callback.

window.addEventListener('load', function () {
  window.document.getElementById('main').innerHTML = data;
}, { once: true });

edited Mar 19 '19 at 15:03

answered Mar 19 '19 at 14:46

3limin4t0r

19,353
2
31
52

Now it works just fine but the other problem that I'm having is `$('#main').html(data)` gets me other results then `document.getElementById('main').innerHTML = data;` Is there a way to use the jQuery code on the new tab that I created? – rdlgi Mar 20 '19 at 07:04
You can still use jQuery since the JavaScript doesn't run on the new page, but merely effects it. Have a look at https://stackoverflow.com/questions/7788480/using-jquery-to-access-a-new-windows-dom to see how you can use it using the newly created page. – 3limin4t0r Mar 20 '19 at 09:55

Is it possible to use jQuery on a new window?

2 Answers2