3 Replies - 2130 Views - Last Post: 02 March 2015 - 02:29 PM

#1 drayarms  Icon User is offline

  • D.I.C Head

Reputation: 4
  • View blog
  • Posts: 199
  • Joined: 18-May 11

Write javascript code into a popup window?

Posted 01 March 2015 - 08:55 PM

Basically, what I'm trying to accomplish is create a popup window, that contains a login form. So obviously, I need to include some AJAX script within the popup window to accomplish this. But I don't know how to go about writing javascript code into the the popup window, which can access DOM elements in the popup window. In this demo, I have created a simple popup window containing a div. I want to be able to attach an even listener to the div, so that when I click on it, some action takes place. But it doesn't work. How can I fix it?


javascript
	function open_popup(){
	

    	       var myWindow = window.open("", "_blank", "toolbar=no, scrollbars=no, resizable=no, width=300, height=200");
    	
  
		
		mywindow.document.write("<!DOCTYPE html> <html> <head>");
		
			mywindow.document.write("<script type = 'text/javascript' src= 'http://code.jquery.com/jquery-latest.js'> </script>");
		
			mywindow.document.write("<script>");
			
				mywindow.document.write("$(document).ready(function(){");
			
				        mywindow.document.write("$('.div_inside_popup').click(function(){");
				
					        mywindow.document.write("alert('yo')");
					
				        mywindow.document.write("});");
				
				mywindow.document.write("});");
			
			mywindow.document.write("</script>");
		
		mywindow.document.write("</head>");
		
		mywindow.document.write("<body>");
		
			
			mywindow.document.write("<div class = 'div_inside_popup'>");
	
			mywindow.document.write("</div>");
			
		mywindow.document.write("</body> </html>");
		
		
		mywindow.document.close();

	
    	
	}
	







html
<div onclick="open_popup()"> </div>



This post has been edited by andrewsw: 02 March 2015 - 06:01 AM
Reason for edit:: Reduced length of title


Is This A Good Question/Topic? 0
  • +

Replies To: Write javascript code into a popup window?

#2 andrewsw  Icon User is offline

  • lashings of ginger beer
  • member icon

Reputation: 6340
  • View blog
  • Posts: 25,572
  • Joined: 12-December 12

Re: Write javascript code into a popup window?

Posted 02 March 2015 - 05:57 AM

mywindow is not the same as myWindow, Javascript is case-sensitive.

You cannot write "<script>" or "</script>" to the window, these are specifically disallowed. You have to split up these terms. You also need some text within the div for the user to click on.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<button onclick="open_popup()">Log in</button>

<script>

function open_popup(){

    var myWindow = window.open("", "_blank", "toolbar=no, scrollbars=no, resizable=no, width=300, height=200");

    mywindow.document.write("<!DOCTYPE html> <html> <head><scr");

    mywindow.document.write("ipt type = 'text/javascript' src= 'http://code.jquery.com/jquery-latest.js'> </");

    mywindow.document.write("script><scr");

    mywindow.document.write("ipt>$(document).ready(function(){");

    mywindow.document.write("$('.div_inside_popup').click(function(){");

    mywindow.document.write("alert('yo')");

    mywindow.document.write("});");

    mywindow.document.write("});");

    mywindow.document.write("</scr");

    mywindow.document.write("ipt></head>");

    mywindow.document.write("<body>");

    mywindow.document.write("<div class = 'div_inside_popup'>");

    mywindow.document.write("Hello</div>");

    mywindow.document.write("</body> </html>");

    mywindow.document.close();
    
}
</script>
</body>
</html>


Unfortunately, the DIC editor has not capitalized the 'W' in 'myWindow' throughout.

This post has been edited by andrewsw: 02 March 2015 - 06:02 AM

Was This Post Helpful? 0
  • +
  • -

#3 drayarms  Icon User is offline

  • D.I.C Head

Reputation: 4
  • View blog
  • Posts: 199
  • Joined: 18-May 11

Re: Write javascript code into a popup window?

Posted 02 March 2015 - 02:28 PM

Thanks for that solution. Splitting the <script> tags was all I needed. Code works just fine now.

This post has been edited by andrewsw: 02 March 2015 - 02:30 PM
Reason for edit:: Removed previous quote, just press REPLY

Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is offline

  • lashings of ginger beer
  • member icon

Reputation: 6340
  • View blog
  • Posts: 25,572
  • Joined: 12-December 12

Re: Write javascript code into a popup window?

Posted 02 March 2015 - 02:29 PM

Glad it's sorted.

BTW You do not need to quote the large previous post, there is a Reply button further down the page.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1