Your SlideShare is downloading. ×
0
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Javascript validating form
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Javascript validating form

1,460

Published on

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,460
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
30
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. JAVASCRIPTFORM VALIDATION SOURCE: www.w3schools.com
  • 2. 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?
  • 3. USING RETURN STATEMENT IN VALIDATING FORM• When using the return statement/function return false, the function will stop executing, and return the specified value.
  • 4. 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>
  • 5. 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>
  • 6. <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;}
  • 7. 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>
  • 8. <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>
  • 9. BROWSER’S OUTPUT

×