Javascript validating form
Upcoming SlideShare
Loading in...5
×
 

Javascript validating form

on

  • 1,863 views

 

Statistics

Views

Total Views
1,863
Views on SlideShare
1,863
Embed Views
0

Actions

Likes
0
Downloads
20
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Javascript validating form Javascript validating form Presentation Transcript

    • JAVASCRIPTFORM VALIDATION SOURCE: www.w3schools.com
    • JavaScript Form Validation• JavaScript can be used to validate data in HTML forms before sending off the content to a server.Form data that typically are checked by a JavaScript could be:• has the user left required fields empty?• has the user entered a valid e-mail address?• has the user entered a valid date?• has the user entered text in a numeric field?
    • USING RETURN STATEMENT IN VALIDATING FORM• When using the return statement/function return false, the function will stop executing, and return the specified value.
    • Required Fields• The function below checks if a field has been left empty. If the field is blank, an alert box alerts a message, the function returns false, and the form will not be submitted<script>function validateForm(){ if(document.myForm.fname.value== ‘ ’) { alert("First name must be filled out"); return false; } }</script>
    • The function above could be called when a form is submitted:<form name="myForm"action="demo_form.asp"onsubmit="return validateForm()"method="post">First name: <input type="text"name="fname"><input type="submit" value="Submit"></form>
    • <html><body><script>function validateForm(){if(document.myForm.lname.value== ‘ ‘){alert("Last name must be filled out")return false;}if(document.myForm.fname.value==‘ ‘){alert("First name must be filled out")return false;}
    • if(document.myForm.mname.value==‘ ’){alert("Middle name must be filled out")return false;}if(document.myForm.bdate.value==‘ ‘){alert("Birthdate must be filled out")return false;}}</script>
    • <form name= "myForm" onsubmit= "returnvalidateForm()" action= "demo.form.asp"method= "post"/>Last Name: <input type= "text" name= "lname"/><br>First Name:<input type= "text" name= "fname"/><br>Middle Name:<input type= "text" name="mname"/> <br>Birthdate: <input type= "date" name= "bdate"/><br><input type= "submit" value= "Submit"/></form></body></html>
    • BROWSER’S OUTPUT