• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1546
  • Last Modified:

Embedding JavaScript in JSP

The problem is I've created a JSP page and I would like to be able to click on a button...which will lead to a JavaScript function that will validate form information here is the code:

The JSP file:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<SCRIPT LANGUAGE="JavaScript" SRC="myscript.js">

</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<jsp:include page="/banner.html"/>
<%@page import="finalProject.beans.*, java.util.*,finalProject.*,java.text.*" %>

<body>
<center>

<form name="customerForm" action="/FinalProject/servlet/finalProject.registrationServlet" method="post">
      <h3>Register</h3>
      <br><br><br>
      <table>
            <tr>
                  <td>Prefix:<br>
                  <select name="prefix">
                        <option value="" selected>--</option>
                        <option value="Ms">Ms</option>
                        <option value="Mr.">Mr.</option>
                        <option value="Mrs.">Mrs.</option>
                        <option value="Miss">Miss</option>
                  </select>
            </td></tr>
            <tr><td>Enter Your First Name: <br> <input name="first" value="" type="text"></td>
            </tr>
            <tr><td>Enter Your Last Name:<br><input name="last" value="" type="text"></td></tr>
            <tr><td>Enter Your Telephone Number:<br><input name="phone" value="" type="text"></td></tr>
            <tr><td>Enter a Street Address:<br><input name="add" value="" type="text"></td><td>City:<br><input name="city" value="" type="text"></td><td>State:<br><input name="State" value="" type="text"></td><td>Zip:<br><input name="zip" value="" type="text"></td></tr>
            <tr><td>Enter Your Email Address:<br><input name="email" value="" type="text"></td></tr>
      </table>
      <br><BR>
      
      <h3>Please Select a User Name and Password for your Broach.com account:</h3>
      
      <table>
      <tr><td>UserName:<br><input type="text" value="" name="user"></td><td>Password:<br><input type="password" value="" name="password"></td></tr>
      </table>
      
      <h3>Please Enter Your Billing Information:</h3>
      
      <table>
      <tr><td>Credit Card Type<br>
            <select name="credittype">
                  <option value="" selected>--</option>
                  <option value="Visa">Visa</option>
                  <option value="MasterCard">MasterCard</option>
                  <option value="Amex">American Express</option>
                  <option value="Discover">Discover</option>
            </select>
      </td><td>Card Number:<br><input type="password" value="" name="creditNum"></td></tr>
      </table>
<center><input name="submitIt" value="Register Me!" type="button"></center>
</center>
</form>
</body>
</html>

The JS File:
// JavaScript Document
function validateForm(form){
alert("In validateForm");
if(form.prefix.value==null || form.prefix.value==""){
      alert("Please select a Prefix!");
      form.prefix.select();
      form.prefix.focus();
      return;
      }
      
else if(form.first.value==null || form.first.value==""){
      alert("Please Enter Your First Name!");
      form.first.select();
      form.first.focus();
      return;
      }
      
else if(form.last.value==null || form.last.value==""){
      alert("Please Enter Your Last Name");
      form.last.select();
      form.last.focus();
      return;
      }
else if(form.phone.value==null || form.phone.value==""){
      alert("Please your Phone Number!");
      form.phone.select();
      form.phone.focus();
      return;
      }
else if(form.add.value==null || form.add.value==""){
      alert("Please Enter Your Address!");
      form.add.select();
      form.add.focus();
      return;
      }
else if(form.city.value==null || form.city.value==""){
      alert("Please Enter a City!");
      form.city.select();
      form.city.focus();
      return;
      }
else if(form.State.value==null || form.State.value==""){
      alert("Please Enter a State!");
      form.State.select();
      form.State.focus();
      return;
      }
if(form.zip.value==null || form.zip.value==""){
      alert("Please Enter your Zip Code!");
      form.zip.select();
      form.zip.focus();
      return;
      }
if(form.email.value==null || form.email.value==""){
      alert("Please Enter an Email!");
      form.email.select();
      form.email.focus();
      return;
      }
if(form.user.value==null || form.user.value==""){
      alert("Please Enter a User Name!");
      form.user.select();
      form.user.focus();
      return;
      }
if(form.password.value==null || form.password.value==""){
      alert("Please Enter a password!");
      form.password.select();
      form.password.focus();
      return;
      }
if(form.credittype.value==null || form.credittype.value==""){
      alert("Please Select a Credit Card Type!");
      form.credittype.select();
      form.credittype.focus();
      return;
      }
if(form.creditNum.value==null || form.creditNum.value==""){
      alert("Please Enter Your Credit Card Number");
      form.creditNum.select();
      form.creditNum.focus();
      return;
      }

else
      document.mom.submit();

}//close function


I click on the button and NOTHING happens....any ideas.  Is this even possible?
0
cbshell
Asked:
cbshell
1 Solution
 
jmaddaCommented:
Look like you've got a few small problems.

first

<input name="submitIt" value="Register Me!" type="button">

should be

<input name="submitIt" value="Register Me!" type="submit">

second

<form name="customerForm" action="/FinalProject/servlet/finalProject.registrationServlet" method="post">

should be

<form name="customerForm" action="/FinalProject/servlet/finalProject.registrationServlet" method="post" onSubmit="return validateForm(this);">

last

all of the

return; in the javascript

should be

return false;


That should do it.

Hope that helps.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now