...

View Full Version : Need to populate textbox from popup window



jerry4all
12-16-2011, 11:28 AM
Hi,
I have these two pages which I want to link...the index.html is the main page. I want the list.html page to pop up when names is clicked..Then I want to be able to select all or some of the name from the list.html page and inset into the textbox on the index.html page, separated by commas with the list.html closing on insert. hope my ambition is clear enough...

index.html


<body>
Add contacts:<br />
<input name="" type="text" /><br />
<a href="list.html" target="_new">names </a>
</body>

list.html


<body>
Contact list:<br />
<form id="form1" name="form1" method="post" action="">
<p>
<input type="checkbox" name="checkbox" id="checkbox" />
Paul<br />
<input type="checkbox" name="checkbox" id="checkbox" />
Matthew<br />
<input type="checkbox" name="checkbox" id="checkbox" />
Philip<br />
<input type="checkbox" name="checkbox" id="checkbox" />
Grant </p>
<p>
<input type="submit" name="button" id="button" value="Insert" />
<br />
</p>
</form>
<br />
</body>

A simple solution will greatly be appreciated .... thanks

chump2877
12-16-2011, 02:22 PM
This works:

index.html

<?xml version="1.1" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>TITLE</title>
</head>
<body>

Add contacts:<br />
<input name="firstNames" id="firstNames" type="text" /><br />
<a href="list.html" onclick="window.open(this.href); return false;">names</a>

</body>
</html>

list.html

<?xml version="1.1" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>TITLE</title>
</head>
<body>

Contact list:<br />
<form id="form1" name="form1" method="post" action="">
<p id="firstNames">
<input type="checkbox" name="checkbox" id="checkbox" value="Paul" />
Paul<br />
<input type="checkbox" name="checkbox" id="checkbox" value="Matthew" />
Matthew<br />
<input type="checkbox" name="checkbox" id="checkbox" value="Philip" />
Philip<br />
<input type="checkbox" name="checkbox" id="checkbox" value="Grant" />
Grant </p>
<p>
<input type="button" name="button" id="button" value="Insert" onclick="insertVals('firstNames');" />
<br />
</p>
</form>
<br />

<script type="text/javascript">
function insertVals(namesContainerID)
{
var inputs = document.getElementById(namesContainerID).getElementsByTagName('input');
var insertStr = '';
for (var i=0; i<inputs.length; i++)
{
if (inputs[i].type == "checkbox")
{
if (inputs[i].checked)
{
insertStr += (insertStr != '') ? ',' : '';
insertStr += inputs[i].value;
}
}
}
window.opener.document.getElementById('firstNames').value = insertStr;
window.close();
}
</script>

</body>
</html>

jerry4all
12-17-2011, 11:16 AM
Thanks Chump...but seems it doesn't work on chrome.

chump2877
12-17-2011, 11:36 AM
It works for me. Couple of things to check:

1) Make sure Chrome's popup blocker didn't eat up the new window.
2) Run the files on a web server. Chrome has stricter Same-Origin-Policy than other browsers. This policy doesn’t allow web-applications to open (via JavaScript) files from the file-system (they apparently are not from the same origin;] ). (http://fascynacja.wordpress.com/2010/07/14/gwt-2-0-chrome-unsafe-javascript-attempt-to-access-frame-with-url/)

jerry4all
12-17-2011, 12:30 PM
ok...it works on firefox, the pop-up window opens in chrome but the insert and close doesnt work

chump2877
12-17-2011, 01:22 PM
What is the URL in the address bar of chrome?

If it says something like:


file:///C:/xampp/htdocs/test/index.html

...then that apparently won't work. Instead it needs to read something like:


http://localhost/test/index.html

or
http://yourdomain.com/test/index.html

The former is a local file system address, and the latter is a web server address.

Do you have access to a web server? Upload the files to the server then, and then try running the script. Alternatively, you could try a local development server like XAMPP (http://www.apachefriends.org/en/xampp.html).


Edit: The reason for doing this appears to be attributable to the following JS error in Chrome:


Unsafe JavaScript attempt to access frame with URL file:///C:/xampp/htdocs/test/index.html from frame with URL file:///C:/xampp/htdocs/test/list.html. Domains, protocols and ports must match.
list.html:45Uncaught TypeError: Cannot call method 'getElementById' of undefined

If you are getting the same or similar error (check the Javascript Console under Tools), then running the code on a web server will fix your problem.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum