Jump to content


Photo

Help With Onbeforeunload()


  • Please log in to reply
2 replies to this topic

#1 shaunie

shaunie

    Advanced Member

  • Members
  • PipPipPip
  • 53 posts

Posted 08 December 2012 - 06:48 AM

Hi,

I have been asked to modify a form to ensure that fields have been completed. The problem is the user is still able to click on the 'leave page' button. This actually redirects to the existing page when the add new button is pressed so the user can still get away with entering blank entries. Can anyone tell me how I can get around this please? Here is my form:


</style>
</head>
<SCRIPT LANGUAGE="Javascript1.2" TYPE="text/javascript">
<!--
isSaved = false;

function unloadMess(){
mess = "Please make sure that you have saved all changes before leaving the page."
if(!isSaved) return mess;
}

function allSaved(){
var x=document.forms["input_style"].addcfrcode;
if (x==null || x==""){
alert("Code must be selected");
return false;
} else {
isSaved = true;
}
}


//-->
</SCRIPT>

<body onbeforeunload="return unloadMess()" >

<form method=post enctype="multipart/form-data" id="input_style" name="input_style">

<div><input id="save_btn" type=submit name=update onclick="allSaved()" value="Save Changes"></div>

<p align="right"><b>Budget Company X</b></p>

<div style="width:100%; height:500px">

<table cellSpacing=1 cellPadding=5 width="100%" border=1>

<tr>

<td class=info align=left colspan=11><bExpenditure</b></td>

</tr>

<tr>

<td class=info align=left><b>Code</b></td>

<td class=info align=left><b>Cost</b></td>

<td class=info align=left></td>

<td class=info align=left><b>Description</b></td>

<td class=info align=left></td>

<td class=info align=left><b>Actual<br />Aug-2012/Aug-2012</b></td>

<td class=info><b>Budget<br />Sep-2012/Aug-2013</b></td>

<td class=info><b>Budget<br />Sep-2013/Aug-2014</b></td>

<td class=info><b>Budget<br />Sep-2014/Aug-2015</b></td>

<td class=info align=left><b>Comment</b></td>

</tr>

<tr>

<td class=back align=left>

<select name=addcfrcode>

<option value="" selected></option>

<option value="1">Code 1</option>

<option value="2">Code 2</option>

<option value="3">Code 3</option>

</select>

</td>

<td class=back align=left>

<select name=addchartgroup>

<option value="" selected></option>

<option value="26">Cost A</option>

<option value="27">Cost B</option>

<option value="28">Cost C</option>

</select>

</td>

<td class=info align=left></td>

<td class=back align=left>

<input type=text name=add_desc size=20>

</td>

<td class=info align=left></td>

<td class=back style="text-align: right;">

<input type=text size=10 name="addbudget1" value="">

</td>

<td class="back yearone">

<input class="yearone" type=text size=10 name="addbudget2" value="">

</td>

<td class="back yeartwo">

<input class="yeartwo" type=text size=10 name="addbudget3" value="">

</td>

<td class="back yearthree">

<input class="yearthree" type=text size=10 name="addbudget4" value="">

</td>

<td class=back align=left>

<textarea class="comment" type=text name=comment size=20 value=></textarea>

</td>

<input type=hidden name=addbudgetid value=>

</tr>

<tr>

<td class=back colspan=12>

<input type=submit name=insert onclick="allSaved()" value="Add New">

</td>

</tr>

</table>


#2 kicken

kicken

    Wiser? Not exactly.

  • Gurus
  • 2,731 posts
  • LocationBonita, FL

Posted 08 December 2012 - 08:53 AM

If you want to prevent someone from submitting a form before it has been completed, you need to use an onsubmit handler for the <form> element, not onbeforeunload.  Your onsubmit should validate all the fields to make sure they have been filled in.

Recycle your old CD's, don't trash them!
Did I help you out?  Feeling generous? I accept tips via Paypal or Bitcoin @ 14mDxaob8Jgdg52scDbvf3uaeR61tB2yC7

#3 shaunie

shaunie

    Advanced Member

  • Members
  • PipPipPip
  • 53 posts

Posted 08 December 2012 - 02:25 PM

Hi,

Thanks for your reply, my problem is that the form has 2 buttons, one to add a new row and one to save the changes. The save changes button is necessary to ensure that the other parts of the form have been saved . I would like to be able to add a new row without calling the onbeforeunload() function and instead using the onsubmit() function to validate, however I believe onbeforeunload() should be used in all other cases. Is this possible?




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com