www.webdeveloper.com
Results 1 to 5 of 5

Thread: [RESOLVED] Problem With My Script

  1. #1
    Join Date
    May 2012
    Posts
    3

    resolved [RESOLVED] Problem With My Script

    Hello.

    I have a page with a form. The form on this page isn't the form that is submitted. When the user clicks on a button at the bottom of the form, a JavaScript function (sendForm()) is called. This function creates a pop-up window (has a form with hidden form elements), sets variables that reference all form elements on the main page, then creates variables that reference all of the hidden form elements on the pop-up window, and then assigns the values from the main page's form elements to the pop-up window's hidden form elements via setAttribute(), and then submits the form.

    The script executes fine until it reaches the last segment, where the values of the main window are set to the values of the pop-up window's hidden form elements. The error I get; "name2.setAttribute("value", name1.value);".

    I ran each individual statement in Firebug and Chrome's Developer Console to try and execute each part of the script to pinpoint where it b0rks itself. The strange thing is that it runs fine when execute each command one-by-one in the console (simulating how the script would run). This leads me to think; would the script be trying to reference forms on the pop-up window before it has a chance to load?

    The function:
    Code:
    function sendForm() {
        // (Reminder): Only methods can be called on objects of the other window. Values cannot be assigned to any of their properties.
        var newWindow = open("submit.html", "Send", "width=400, height=300");
        var form1 = document.getElementById("inputForm");
        var form2 = newWindow.document.getElementById("inputForm");
        var userAgent1 = document.getElementById("userAgent");
        var referrer1 = document.getElementById("referrer");
        var name1 = document.getElementById("name");
        var email1 = document.getElementById("email");
        var color1 = document.getElementById("color");
        var comments1 = document.getElementById("comments");
        var gender1 = document.getElementsByName("gender");
        for (var i = 0; i < gender1.length; i++) {
            if (gender1[i].value === "male") {
                gender1 = "male";
            } else {
                gender1 = "female";
            }
        }
        var userAgent2 = newWindow.document.getElementById("userAgent");
        var referrer2 = newWindow.document.getElementById("referrer");
        var name2 = newWindow.document.getElementById("name");
        var email2 = newWindow.document.getElementById("email");
        var color2 = newWindow.document.getElementById("color");
        var comments2 = newWindow.document.getElementById("comments");
        var gender2 = newWindow.document.getElementById("gender");
        
        name2.setAttribute("value", name1.value);
        email2.setAttribute("value", email1.value);
        color2.setAttribute("value", color1.value);
        comments2.setAttribute("value", comments1.value);
        gender2.setAttribute("value", gender1);
    }
    Form from main page:
    Code:
                	<form id="inputForm">
                        <p>Your name:<br /><input type="text" id="name" name="name" /></p>
                        <p>Your email:<br /><input type="text" id="email" name="email" /></p>
                        <p>Favorite color:<br /><input type="text" id="color" name="color" /></p>
                        <p>Comments about this page:</p><textarea id="comments" name="comments"></textarea>
                        <p><input type="radio" name="gender" value="male" />Male <input type="radio" name="gender" value="female" />Female</p>
                        <p><input type="button" id="send" value="Send" /><input type="button" id="clear" value="Clear Form" /></p> 
                    </form>
    Form on pop-up window:
    Code:
    <form id="inputForm" method="post" action="example@example.com">
                <input type="hidden" name="recipient" value="example@example.com" />
                <input type="hidden" name="subject" value="CompIV JS Demo Page" />
                <input type="hidden" id="userAgent" name="userAgent" value="" />
                <input type="hidden" id="referrer" name="referrer" value="" />
                <input type="hidden" id="name" name="name" value="" />
                <input type="hidden" id="email" name="email" value="" />
                <input type="hidden" id="color" name="color" value="" />
                <input type="hidden" id="comments" name="comments" value="" />
                <input type="hidden" id="gender" name="gender" value="" />
            </form>

    I have been debugging this script for the past few hours, and cannot figure out what is causing the problem.

    Any help would be more than appreciated. Thanks!

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    pass all the values via URL
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  3. #3
    Join Date
    May 2012
    Posts
    3

    Unhappy

    Thanks for the reply!

    That would have worked flawlessly, except, I have discovered that the CGI script the form submits its data to, requires it be done through the POST method, rather than GET.

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    try this
    Attached Files Attached Files
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  5. #5
    Join Date
    May 2012
    Posts
    3
    Wow, thanks!

    This solved my problem!

    I appreciate it very much!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles