CODEWITHSUNDEEP
javascriptpopupcross-page-postback
Craig Wayne
Craig Wayne

Reputation: 5060

Getting Value From Popup Window Using only JS & HTML

Is it possible to get a value from a popup window? Additionally I would like to use JS and HTML only, i.e. no PHP. Is this even possible? I've seen other posts on here like this one:

getting value from popup window

but that's in aspx.

I have googled a bit and found this link:

http://www.bignosebird.com/js/popmap.shtml

However, it works on that guys site but not when i copy and paste it, I may be a noob so this is what I have:

parent.html

<html>
<head>
</head>
<body>
<form>
<INPUT TYPE="TEXT" NAME="maparea" SIZE=2 VALUE="">
<input type=button onClick='targetitem = document.forms[0].maparea; dataitem = window.open("map.shtml", "dataitem", "toolbar=no,menubar=no,scrollbars=yes"); dataitem.targetitem = targetitem' value="Show Map">
</form>
</body>
</html>

map.shtml

<html>
<head>
<script>
function select_item(item)
{
targetitem.value=item;
top.close();
return false;
}
</script>
</head>

<body>

<CENTER>
<B>Our Map</B>
<BR>

<IMAGE SRC="map1.gif" ISMAP USEMAP="#MAP1">
<MAP NAME="MAP1">
<AREA SHAPE=RECT COORDS="11,10,116,133" HREF="" onClick='return select_item("1")'>
<AREA SHAPE=RECT COORDS="121,11,227,172" HREF="" onClick='return select_item("2")'>
<AREA SHAPE=RECT COORDS="11,140,115,226" HREF="" onClick='return select_item("3")'>
<AREA SHAPE=RECT COORDS="119,177,225,227" HREF="" onClick='return select_item("4")'>
<AREA SHAPE=default HREF="" >
</MAP>
</CENTER>
</body>
</html>

Any help would be greatly appreciated.

Upvotes: 1

Views: 18420

Answers (1)

eleuteron
eleuteron

Reputation: 1983

It works for me (using Firefox 20.0). But the code is really ugly and old though, probably you should study the present standards of MSDN Window to understand how it works in firefox (Window object may change its behaviour in other browsers). Ah, and of course the ECMAScript . But to introuduce one of the multiple solutions, you could try this:
parent.html 

<input type="text" id="output"/>
<button id="show">Open</button>

<script>
    document.getElementById('show').addEventListener('click', function(){
        window['output'] = document.getElementById('output');
        window.open('map.html')
    });
</script>

maps.html (I changed the extension!) 

<input type="text" id="user_text"/>
<input id="send" type='button' value'send'/>

<script>
    document.getElementById('send').addEventListener('click', function(){
    window.opener['output'].value = document.getElementById('user_text').value;
})
</script>

Upvotes: 2

Related Questions