Home Answers Viewqa JavaScriptQuestions How do i validate form using javascript and send data to database?

 
 


ricky
How do i validate form using javascript and send data to database?
1 Answer(s)      2 years and a month ago
Posted in : JavaScript Questions

I need a "JOIN US" form that can validate using javascript and be able to connect with and post data into a database.

The details to be validated and posted into the database are: FIRST NAME, LAST NAME, EMAIL ADDRESS, PHONE NUMBER, ADDRESS, CITY

Kindly assist. Thanks

View Answers

April 12, 2011 at 1:30 PM


1)joinus.jsp:

<html>
<center>
<h2>JOIN US</h2>
</center>
<script>
function ValidPhone(aphone)
{
    var valid = "0123456789";
         if(aphone=="")
         {
    alert ("This field is required. Please enter phone number without dashes!")
         return false
         }
         if(aphone.length !=10)
         {
    alert("Invalid phone number length! Please try again.")
         return false
         }
         for (var i=0; i < aphone.length; i++)
         {
         temp = "" + aphone.substring(i, i+1);
         if (valid.indexOf(temp) == "-1")
         {
    alert("Invalid characters in your field. Please try again.")
          return false;
         }

    }
    return true
}
function validate(){
var fname=document.form.fname.value;
var lname=document.form.lname.value;
var email=document.form.email.value;
var phone=document.form.contactNo.value;
var address=document.form.address.value;
var city=document.form.city.value;
var atpos=email.indexOf("@");
var dotpos=email.lastIndexOf(".");
if(fname==""){
    alert("Please enter first name!");
    document.form.fname.focus();
    return false;
}
 if(lname==""){
    alert("Please enter last name!");
    document.form.lname.focus();
    return false;
}
 if(email==""){
    alert("Please enter email id!");
    document.form.email.focus();
    return false;
  }

if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length)
  {
  alert("Invalid Email ID");
  return false;
  }
   if(!ValidPhone(phone))
         {
         document.form.contactNo.focus()
         return false
         }
         if(address==""){
    alert("Please enter address!");
    document.form.address.focus();
    return false;
}
if(city==""){
    alert("Please enter city!");
    document.form.city.focus();
    return false;
}
return true;

}
</script>

<form name="form" method="post" action="insert.jsp" onsubmit="return validate();">
<center>
<table>
<tr><td> First Name</td><td><input type="text" name="fname"></td></tr>
<tr><td> Last Name</td><td><input type="text" name="lname"></td></tr>
<tr><td> Email</td><td><input type="text" name="email"></td></tr>
<tr><td> Contact No</td><td><input type="text" name="contactNo"></td></tr>
<tr><td> Address</td><td><input type="text" name="address"></td></tr>
<tr><td> City</td><td><input type="text" name="city"></td></tr>

<tr><td><input type="submit" value="Save"></td><td><input type="reset" value="Reset"></td></tr>
</table>
</center>
</form>
</html>

2)insert.jsp:

<%@page import="java.sql.*,java.util.*"%>
<table>
<%
String fname=request.getParameter("fname");
String lname=request.getParameter("lname");
String email=request.getParameter("email");
String phone=request.getParameter("contactNo");
String address=request.getParameter("address");
String city=request.getParameter("city");
        try{
        Class.forName("com.mysql.jdbc.Driver");
        Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "root");
        Statement st=con.createStatement();
        int i=st.executeUpdate("insert into login(firstname,lastname,email,contactNo,address,city) values('"+fname+"','"+lname+"','"+email+"','"+phone+"','"+address+"','"+city+"')");
        out.println("Data is successfully inserted!");
        }
        catch(Exception e){
        System.out.print(e);
        e.printStackTrace();
        }
        %>









Related Pages:

Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.