form submission discrepency

Discussion in 'JavaScript' started by Jamie18, Jun 19, 2007.

  1. #1
    hey

    I've got an agreement form be initialized by a checkbox, when someone hits the checkbox a popup comes to ask if they agree to the terms or not, if they select agree and submit, the check stays, if they select cancel and submit, the check vanishes. I'm having a problem when it comes to the client closing the window without a selection.

    When this happens the checkbox remains checked.

    my app looks similar to the following.

    <head>
    <script type="text/javascript>
    function badanswercheck
    {
    // SelectedIndex is 0 for agree, 1 for cancel, -1 initially
    if (document.myform.myselect.selectedIndex != 0)
    {
    document.myform.myselect.selectedIndex = 1;
    document.myform.submit();
    }
    }
    </script>
    </head>

    <body onUnload="badanswercheck;">
    <form name="myform" action="somepage.cfm" method="post">
    <select name="myselect">
    <option>Agree
    <option>Cancel
    </select>
    <input type="submit" value="Submit">
    </form>
    </body>

    so the javascript document.myform.submit() isn't behaving the same way as the forms submit, does anyone have any idea why this is happening? or if there is some other problem in my javascript which is causing this?
     
    Jamie18, Jun 19, 2007 IP
  2. Mike H.

    Mike H. Peon

    Messages:
    219
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I don't see a checkbox. I don't see a popup. Post the all the code.

    Describe exactly what you are trying to do.
     
    Mike H., Jun 19, 2007 IP
  3. Jamie18

    Jamie18 Peon

    Messages:
    201
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #3
    ok well, it is a fairly complex app made by someone other than myself.. so i don't know it all that well..

    the site is all encoded in a mixture of coldfusion, sql, javascript and html

    to include every page that gets rifled through would be far too time consuming.

    i will try to elaborate though.

    it's something like this,



    //thispage.cfm
    ...
    <input type="checkbox" onChange="window.open('nextpage.cfm?checkboxclicked=#currentrow#', 'popuppage', sizeoptions>
    ...

    this opens a page of javascript

    //nextpage.cfm
    <script language="javascript">
    ...
    //set some variables from the opener form
    ...
    var thirdpage = thirdpage.cfm?var1=val1&var2=val2&etc
    window.location=thirdpage

    //function to retrieve which checkbox has been clicked from the url
    </script>

    now the page i outlined earlier is the one entitled thirdpage.cfm

    but just to restate the problem, it is that the javascripts document.myform.submit() command isn't submitting the form the same way that the submit button does in the uniquely titled thirdpage.cfm

    thanks for taking a look
     
    Jamie18, Jun 19, 2007 IP
  4. Mike H.

    Mike H. Peon

    Messages:
    219
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Using onload, onunload, etc, within the opening body tag, should be like this, with parens:

    <body onUnload="badanswercheck()">


    I NEVER put onload, onunload, etc. within the opening body tag:

    I use this, as the LAST line in the script section, NO parens.

    
           onunload=badanswercheck;
    
    </script>
    Code (markup):
    You can also try
    on[B]before[/B]unload=badanswercheck
    Code (markup):
    The form data might already be gone using onunload, prior to the submit().
     
    Mike H., Jun 19, 2007 IP
  5. Jamie18

    Jamie18 Peon

    Messages:
    201
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #5
    well, I did have the parenthesis before, sorry, forgot to include them in this..

    when i tried moving the onBeforeUnload/onUnload into the bottom of the script (and removing parens) the badanswercheck function was never run. (I have alert boxes set up for debugging purposes.) does this mean there is a syntax error in my script?
     
    Jamie18, Jun 20, 2007 IP
  6. Mike H.

    Mike H. Peon

    Messages:
    219
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Maybe you misunderstood. I wrote that it should be "the LAST line in the script section," not "the bottom of the script."

    In other words, I don't know where the heck you put that line of code.

    The function will execute on unload, or if you used onbefore unload.

    I would put an alert as the first line in the badanswercheck function:

    alert('badanswercheck');

    This line goes immediately preceding the CLOSING SCRIPT TAG:
    
           onunload=badanswercheck;
    
    </script>
    Code (markup):
    Make sure the spelling is correct. You don't use "standard" notation, like, badAnswerCheck, to make it more readable.

    And of course, you have to remove the onunload from the opening BODY tag.
     
    Mike H., Jun 20, 2007 IP
  7. Jamie18

    Jamie18 Peon

    Messages:
    201
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #7
    I had the placement of the tag right, I think I must have capitalized some of the letters in onbeforeunload. but I've got it working again but with the same result.

    When the call to badanswercheck is made it checks to see if the current index isn't 0, than alerts me to the value of the index, than changes the index to 1 and alerts me to the new value of the index. at this point i call the document.myform.submit() command


    <script type="text/javascript">

    function badanswercheck()
    {
    if (document.myform.myselect.selectedIndex != 0)
    {
    alert('response value:' + document.myform.myselect.selectedIndex);
    document.myform.myselect.selectedIndex = 1;
    alert('response value:' + document.myform.myselect.selectedIndex);

    document.myform.submit();
    }
    }

    onbeforeunload=badanswercheck;

    </script>

    so the onbeforeunload command is working the same way as it was in the body tag and the form submission still isn't happening

    there isn't a problem a problem in the document.myform.submit() statement is there? I've checked to make sure that myform is the right name and it is in the document by an alert(document.myform.name); and alert(document.forms[0].name)
     
    Jamie18, Jun 21, 2007 IP
  8. Jamie18

    Jamie18 Peon

    Messages:
    201
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Is it just not possible to submit a form after the close button has been pressed?
     
    Jamie18, Jun 21, 2007 IP
  9. Mike H.

    Mike H. Peon

    Messages:
    219
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #9
    I've tried to get the form to submit, too.

    The only thing I can suggest is to use an AJAX function to POST the data to somepage.cfm.

    Try the following AS IS. Just upload it and see if the values are POSTed to somepage.cfm, when you close the .html page.

    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Any Title</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    
    	function badanswercheck(){
    
    		alert('submitting');
    		var AdminRequest = window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();   
    		var nForm = document.forms[0];
    		var infoStr = "myselect=" + nForm['mySelect'].selectedIndex;
    		infoStr += "&mytext=" + nForm['myText'].value;
    		AdminRequest.open("POST", "somepage.cfm", true);
    		AdminRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    		AdminRequest.send(infoStr); 
    	}
    
    	onbeforeunload = badanswercheck;
    	
    </script>
    <style type="text/css">
    
    	 body {background-color:#eae3c6;margin-top:60px}
    	 form {width:620px;margin:auto;font-family:times;font-size:12pt}
    	 form input {text-align:right}
    	 fieldset {width:610px;background-color:#f0fff0;border:1px solid #87ceeb}
    	 legend {font-family:times;font-size:14pt;color:#00008b;background-color:#87ceeb;padding-left:3px;padding-right:3px;margin-bottom:5px}
    	.submitBtn {font-family:tahoma;font-size:10pt;display:block;margin-left:auto;margin-right:auto;margin-top:5px;margin-bottom:5px}
    
    </style>
    </head>
    	<body>
    		<form> 
    		   <fieldset>
    			<legend>Form</legend>
    				<label>Some Select</label>
    
    					<select name="mySelect">
    						<option value=""> Make a Selection </option>
    						<option value="1" selected> First </option>
    						<option value="2"> Second </option>
    					</select>
    
    				<label> Some Text </label>
    					<input type="text" name="myText" size="10" value="Testing Testing Testing">
    
    				<input type='submit' name='submit' value="Submit" class='submitBtn'>
    		   </fieldset>
    		</form>
    	</body>
    </html>
    
    Code (markup):
     
    Mike H., Jun 21, 2007 IP
  10. Jamie18

    Jamie18 Peon

    Messages:
    201
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #10
    I played around with that a bit, seems like it would probably be the best solution but yesterday I decided I would just make some window.opener.document.forms[0].elements['thecheckbox].checked = false; statements to handle it.. it's not the best way to handle it cause right now if someone selects agree but closes instead of submitting it acts the same way, i'm tired of playing around with it though so that's how it's gonna stay for a while.

    thanks for the help though anyways
     
    Jamie18, Jun 22, 2007 IP