Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Aug 2011
    Posts
    42
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Need to populate textbox from popup window

    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

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

    PHP Code:
    <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

  • #2
    Senior Coder chump2877's Avatar
    Join Date
    Dec 2004
    Location
    the U.S. of freakin' A.
    Posts
    2,860
    Thanks
    22
    Thanked 157 Times in 148 Posts
    This works:

    index.html
    Code:
    <?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
    Code:
    <?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>
    Regards, R.J.

    ---------------------------------------------------------

    Help spread the word! Like my YouTube-to-Mp3 Conversion Script on Facebook !! :-)
    [Related videos and tutorials are also available at my YouTube channel and on Dailymotion]
    Get free updates about new software version releases, features, and bug fixes!
    ♪♪ …Need Web Hosting For My YouTube-To-Mp3 Conversion Software? Check Here !!… ♪♪

  • #3
    New Coder
    Join Date
    Aug 2011
    Posts
    42
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks Chump...but seems it doesn't work on chrome.

  • #4
    Senior Coder chump2877's Avatar
    Join Date
    Dec 2004
    Location
    the U.S. of freakin' A.
    Posts
    2,860
    Thanks
    22
    Thanked 157 Times in 148 Posts
    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;] ).
    Regards, R.J.

    ---------------------------------------------------------

    Help spread the word! Like my YouTube-to-Mp3 Conversion Script on Facebook !! :-)
    [Related videos and tutorials are also available at my YouTube channel and on Dailymotion]
    Get free updates about new software version releases, features, and bug fixes!
    ♪♪ …Need Web Hosting For My YouTube-To-Mp3 Conversion Software? Check Here !!… ♪♪

  • #5
    New Coder
    Join Date
    Aug 2011
    Posts
    42
    Thanks
    1
    Thanked 0 Times in 0 Posts
    ok...it works on firefox, the pop-up window opens in chrome but the insert and close doesnt work

  • #6
    Senior Coder chump2877's Avatar
    Join Date
    Dec 2004
    Location
    the U.S. of freakin' A.
    Posts
    2,860
    Thanks
    22
    Thanked 157 Times in 148 Posts
    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:

    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.

    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.
    Last edited by chump2877; 12-17-2011 at 02:31 PM.
    Regards, R.J.

    ---------------------------------------------------------

    Help spread the word! Like my YouTube-to-Mp3 Conversion Script on Facebook !! :-)
    [Related videos and tutorials are also available at my YouTube channel and on Dailymotion]
    Get free updates about new software version releases, features, and bug fixes!
    ♪♪ …Need Web Hosting For My YouTube-To-Mp3 Conversion Software? Check Here !!… ♪♪


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •