How to create Feedback Form?
In this article I will use the required field validator so you can't leave any required information.
Example: See the following example to create the Feedback Form.
<html>
<head><title>Feedback</title>
<script type="text/javascript">
function validate()
{
if ((document.feedback.name.value=="")||(document.feedback.feed.value==""))
{
alert ("You must fill in all of the required .fields!")
return false
}
else
return true
}
</script>
</head>
<body bgcolor="#ccccff">
<form name="feedback" onsubmit="return validate()">
Enter Your Name:
<input type="text" size="30" name="name">
<strong><font color=red>*</font>(required)</strong><br /><br />
Feedback please:
<textarea name="feed" rows="3" cols="25"></textarea>
<strong><font color=red>*</font>(required)</strong><br /><br />
Your home address:
<input type="text" size="30" name="address">
<strong><font color=red>*</font>(NOT required)</strong><br /><br />
<input type="submit" name="Btn1" value="Submit">
<input type="reset" name="Btn2" value="Reset">
</form>
</body>
</html>
What is 'return true' and 'return false'?
This is what's used to actually allow, or stop the form from submitting, respectively. This is how JavaScript controls the submitting of a form. By default, a form will return true.
What is OnSubmit?
Here you will see the "onsubmit" handler is inserted inside the <form> tag like this:
<form name="feedback" onsubmit="return validate()">
And not insert inside any one element like this:
<input type=text value="Hi" onClick="show()"> <%--here you can't use onsubmit--%>
Output:
Figure 1: Output of the given script.
Enter your name and feedback text in required field and click on 'submit' button then feedback will be submit. Here home address is optional to fill up.
Required field:
If you leave the required sections blank and you click on 'submit' button you will be forced to come back and fill this box (see the figure 2).
Figure 2: In this figure I have fill only name so it return the message.
Reset: Click on reset button to clear the fields.