iVikashJha
iVikashJha

Reputation: 169

How to click a button on pop up window

I have button on my first page.

<button id="btm" onclick="window.open('page.htm', '_blank', 'toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400')">Button1</button>

I have another page.htm with below html

<button id="testbtn" onclick="window.open('http://www.ivikashjha.com', '_blank', 'toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400')">Button2</button>

I want to open the website ivikasjha.com on first button click itself. Actually I want to access controls of pop up page on main parent page.

Upvotes: 2

Views: 962

Answers (1)

JoshWillik
JoshWillik

Reputation: 2645

Same domain

An in-browser test (Firefox 35) seems to indicate that if the opened window is inside the same domain, the page has some access

var child = window.open( 'http://example.com' )
child.localStorage.setItem( 'hello', 'there' ) // Sets correctly
child.$( 'body' ).css( 'background', 'blue' ) // Access denied to '$'

Different domains

A test across domains, however, seems to restrict the available interface to location, parent, postMessage, and a couple others

var child = window.open( 'http://other-domain.com' )
child.localStorage // cannot access

window.postMessage is left available to you. Posting messages back and forth between the two tabs isn't the easiest way to do things, but at least you can tell the popup to click it's own button.

If that fails, there's no restrictions on both pages opening up a shared websocket in the background and communicating that way.

Takeaway

The easiest way to spread functionality between tabs seems to be message posting:

//Parent page
var childUrl = 'http://hello.example.com' )
var child = open( childUrl )
child.postMessage( 'click-button', childUrl )

//Child page
window.addEventListener( 'message', function( event ){
  if( event.data === 'click-button' ){
    $( '#my-button' ).click()
  }
}, false )

Upvotes: 1

Related Questions