Help With Onbeforeunload()

shaunie · December 8, 2012

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>

kicken · December 8, 2012

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.

shaunie · December 8, 2012

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?

Sign In

Help With Onbeforeunload()

Recommended Posts

shaunie

Link to comment

Share on other sites

kicken

Link to comment

Share on other sites

shaunie

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information