Hi there, I have added a validation script to this page http://antobbo.webspace.virginmedia.com/webediting/documents.htm but it is not working the way I want it to, I am sure I made some silly mistake.
Basically I want to make sure that people actually input something in the form below before submitting it. If they attempt to submit it blank they get a pop up window saying that they should type something inside but unfortunately after clicking ok on the box the form gets submitted (goes to a php page with the thank you message).
Now, when the pop up window with the alert message comes up I would like to be able to click OK and prevented from submitting the form till I type something in.
The full script I have is this:
<!--BEGINNING JAVA SCRIPT -->
<script type="text/javascript">
<!--
function showCommentBox()
{
var feedback_box = document.getElementById('comment');
feedback_box.className='visible' ;
feedback_box.className='comment_box';
}
function validation(field,message)
{
if(field.value.length==0)
{
alert(message);
field.focus();
return false;
}
return true;
}
//-->
</script>
<!-- END JAVA SCRIPT-->
and this is the html element:
<form action="email.php" method="post" onsubmit="validation(document.getElementById('commentsid'),'Enter a value')">
<p><input type="button" value="Comment" onclick="showCommentBox()"><br></p>
<div class="hidden" id="comment">
<p>Comments and suggestions:<br><textarea name="comments" id="commentsid" rows="3" cols="30"></textarea><br><br>
<input type="submit" value="Send"></p>
</div> <!-- end of comment_box-->
</form>
Is it because the function validation()
is trying to pass the id="commentsid"
before it is declared? If so, can I move the function call to validation()
where the Send button in so that it reads:
<form action="email.php" method="post" >
<p><input type="button" value="Comment" onclick="showCommentBox()"><br></p>
<div class="hidden" id="comment">
<p>Comments and suggestions:<br><textarea name="comments" id="commentsid" rows="3" cols="30"></textarea><br><br>
<input type="submit" onclick="validation(document.getElementById('commentsid'),'Enter a value')" value="Send"></p>
</div> <!-- end of comment_box-->
</form>
WOuld that work?
Thanks