Validating form controls before inserting to database - javascript

I want to insert the records into the database(MySQL) but before insertion i want to validate the form fields whether they are filled by users or not, It must be validate onclick of submit button and i am inserting the records using the annotation method which is related to a java file so, when i am trying to insert the records using spring annotation method and validating the records in JavaScript it gives me the following Error:
HTTP Status 500 - Request processing failed; nested exception is java.lang.NumberFormatException: For input string: ""
My javaScript:
<script type="text/javascript">
function validateFields()
{
var c_name = document.formregisterclinic.ctl00$cphMaster$txtClinicName.value;
var p_no = document.formregisterclinic.ctl00$cphMaster$txtPhone.value;
var st_address = document.formregisterclinic.ctl00$cphMaster$txtStreetAddress.value;
var state = document.formregisterclinic.ctl00$cphMaster$txtState.value;
var city = document.formregisterclinic.ctl00$cphMaster$txtCity.value;}
var zip_code = document.formregisterclinic.ctl00$cphMaster$txtZipCode1.value;
var f_name = document.formregisterclinic.ctl00$cphMaster$txtCPFName.value;
var l_name = document.formregisterclinic.ctl00$cphMaster$txtCPLName.value;
var email = document.formregisterclinic.ctl00$cphMaster$txtEmail.value;
var cell_no = document.formregisterclinic.ctl00$cphMaster$txtCellPhone.value;
var u_name = document.formregisterclinic.ctl00$cphMaster$txtUserName.value;
var pass = document.formregisterclinic.ctl00$cphMaster$txtPassword.value;
var c_pass = document.formregisterclinic.ctl00$cphMaster$txtConfirmPassword.value;
if(c_name == "" || c_name == null)
{
alert("Clinic name can't be blank");
return false;
}
else if(p_no == "" || p_no == null)
{
alert("Phone number can't be blank");
return false;
}
else if(st_address == "" || st_address == null)
{
alert("Street address can't be blank");
return false;
}
else if(state == "" || state == null)
{
alert("State can't be blank");
return false;
}
else if(city == "" || city == null)
{
alert("City can't be blank");
return false;
}
else if(zip_code == "" || zip_code == null)
{
alert("Zip code can't be blank");
return false;
}
else if(f_name == "" || f_name == null)
{
alert("First name can't be blank");
return false;
}
else if(l_name == "" || l_name == null)
{
alert("Last name can't be blank");
return false;
}
else if(email == "" || email == null)
{
alert("Email can't be blank");
return false;
}
else if(cell_no == "" || cell_no == null)
{
alert("Cell number can't be blank");
return false;
}
else if(u_name == "" || u_name == null)
{
alert("User name can't be blank");
return false;
}
else if(pass == "" || pass == null)
{
alert("Password can't be blank");
return false;
}
else if(c_pass == "" || c_pass == null)
{
alert("Confirm password can't be blank");
return false;
}
</script>
My mapping method:
#RequestMapping(value = "/registerclinic", method = RequestMethod.POST)
public String registerclinicdbconnection(Locale locale, Model model, HttpServletRequest req, HttpServletResponse res)throws ServletException
{
String clinic_name = req.getParameter("ctl00$cphMaster$txtClinicName");
long phone_no = Long.parseLong(req.getParameter("ctl00$cphMaster$txtPhone"));
String street_add = req.getParameter("ctl00$cphMaster$txtStreetAddress");
String state = req.getParameter("ctl00$cphMaster$txtState");
String city = req.getParameter("ctl00$cphMaster$txtCity");
int zip_code = Integer.valueOf(req.getParameter("ctl00$cphMaster$txtZipCode1"));
String first_name = req.getParameter("ctl00$cphMaster$txtCPFName");
String last_name = req.getParameter("ctl00$cphMaster$txtCPLName");
String email = req.getParameter("ctl00$cphMaster$txtEmail");
long cell_phone = Long.parseLong(req.getParameter("ctl00$cphMaster$txtCellPhone"));
String user_name = req.getParameter("ctl00$cphMaster$txtUserName");
String password = req.getParameter("ctl00$cphMaster$txtPassword");
String c_password = req.getParameter("ctl00$cphMaster$txtConfirmPassword");
// Inserting records to register the clinic by making connection with database.
String queryText = "insert into registerclinic(clinicname,phone,streetadd,state,city,zipcode,firstname,lastname,email,cellphone,username,password) values('"+clinic_name+"','"+phone_no+"','"+street_add+"','"+state+"','"+city+"','"+zip_code+"','"+first_name+"','"+last_name+"','"+email+"','"+cell_phone+"','"+user_name+"','"+password+"')";
try
{
Connection con = null;
Class.forName("com.mysql.jdbc.Driver");
con = (Connection)DriverManager.getConnection("jdbc:mysql://localhost:3306/clinicmanagement","root","dipak");
Statement stat = con.createStatement();
stat.executeUpdate(queryText);
System.out.println("Record has been inserted");
stat.close();
con.close();
return "success";
}catch(Exception ea)
{
System.out.println("Exception Occured.."+ ea);
return "fail";
}
}

seems as though you don't have a return true at the end of your validateFields() method
try below:
function validateFields()
{
var c_name = document.formregisterclinic.ctl00$cphMaster$txtClinicName.value;
var p_no = document.formregisterclinic.ctl00$cphMaster$txtPhone.value;
var st_address = document.formregisterclinic.ctl00$cphMaster$txtStreetAddress.value;
var state = document.formregisterclinic.ctl00$cphMaster$txtState.value;
var city = document.formregisterclinic.ctl00$cphMaster$txtCity.value;}
var zip_code = document.formregisterclinic.ctl00$cphMaster$txtZipCode1.value;
var f_name = document.formregisterclinic.ctl00$cphMaster$txtCPFName.value;
var l_name = document.formregisterclinic.ctl00$cphMaster$txtCPLName.value;
var email = document.formregisterclinic.ctl00$cphMaster$txtEmail.value;
var cell_no = document.formregisterclinic.ctl00$cphMaster$txtCellPhone.value;
var u_name = document.formregisterclinic.ctl00$cphMaster$txtUserName.value;
var pass = document.formregisterclinic.ctl00$cphMaster$txtPassword.value;
var c_pass = document.formregisterclinic.ctl00$cphMaster$txtConfirmPassword.value;
if(c_name == "" || c_name == null)
{
alert("Clinic name can't be blank");
return false;
}
else if(p_no == "" || p_no == null)
{
alert("Phone number can't be blank");
return false;
}
else if(st_address == "" || st_address == null)
{
alert("Street address can't be blank");
return false;
}
else if(state == "" || state == null)
{
alert("State can't be blank");
return false;
}
else if(city == "" || city == null)
{
alert("City can't be blank");
return false;
}
else if(zip_code == "" || zip_code == null)
{
alert("Zip code can't be blank");
return false;
}
else if(f_name == "" || f_name == null)
{
alert("First name can't be blank");
return false;
}
else if(l_name == "" || l_name == null)
{
alert("Last name can't be blank");
return false;
}
else if(email == "" || email == null)
{
alert("Email can't be blank");
return false;
}
else if(cell_no == "" || cell_no == null)
{
alert("Cell number can't be blank");
return false;
}
else if(u_name == "" || u_name == null)
{
alert("User name can't be blank");
return false;
}
else if(pass == "" || pass == null)
{
alert("Password can't be blank");
return false;
}
else if(c_pass == "" || c_pass == null)
{
alert("Confirm password can't be blank");
return false;
}
return true;
}

Related

validation form : how to show error message all at one time for the blank input instead of one by one?

I want to validate my form, if any of the input field is blank, the error warning will show beside the blank input field. The error message must be comes out all at one time for the blank input, not show one by one. How to do this?
Below is my javascript code :
function doValidate()
{
var x=document.forms["form"]["fullname"].value;
if (x==null || x=="")
{
document.getElementById('error1').innerHTML="Full name is required!";
return false;
}
var y=document.forms["form"]["uid"].value;
if (y==null || y=="")
{
document.getElementById('error2').innerHTML="Username is required!";
return false;
}
var z=document.forms["form"]["pwd"].value;
if (z==null || z=="")
{
document.getElementById('error3').innerHTML="Password is required!";
return false;
}
var a=document.forms["form"]["pwd2"].value;
if (a==null || a=="")
{
document.getElementById('error4').innerHTML="Please re-enter your password!";
return false;
}
var pwd = document.getElementById("pwd").value;
var pwd2 = document.getElementById("pwd2").value;
if(pwd != pwd2){
alert('Wrong confirm password!');
return false;
}
var b=document.forms["form"]["role"].value;
if (b==null || b=="Please select...")
{
document.getElementById('error5').innerHTML="Please select user role!";
return false;
}
}
You should start your function with var ok = true, and in each if-block, instead of having return false, you should set ok = false. At the end, return ok.
Here's what that might look like:
function doValidate() {
var ok = true;
var form = document.forms.form;
var fullname = form.fullname.value;
if (fullname == null || fullname == "") {
document.getElementById('error1').innerHTML = "Full name is required!";
ok = false;
}
var uid = form.uid.value;
if (uid == null || uid == "") {
document.getElementById('error2').innerHTML = "Username is required!";
ok = false;
}
var pwd = form.pwd.value;
if (pwd == null || pwd == "") {
document.getElementById('error3').innerHTML = "Password is required!";
ok = false;
}
var pwd2 = form.pwd2.value;
if (pwd2 == null || pwd2 == "") {
document.getElementById('error4').innerHTML = "Please re-enter your password!";
ok = false;
} else if (pwd != pwd2) {
document.getElementById('error4').innerHTML = "Wrong confirm password!";
ok = false;
}
var role = form.role.value;
if (role == null || role == "Please select...") {
document.getElementById('error5').innerHTML = "Please select user role!";
ok = false;
}
return ok;
}
(I've taken the liberty of changing to a more consistent formatting style, improving some variable-names, simplifying some access patterns, and replacing an alert with an inline error message like the others.)

How do I correctly perform form validation in JavaScript?

I am having a hard time trying to do a correct form validation. I have Name, Email, and Phone Number fields. I implemented the validation check for all of them and when I click on the submit query, it returns email as false, but not anything else. It also will still submit the form. How do I fix this?
JSFiddle: http://jsfiddle.net/GVQpL/
JavaScript Code:
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
return false;
}
else if(fullNameV.indexOf(" ") <= fullNameV.length)
{
alert("Not a valid name");
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
return false;
}
var atpos = emailV.indexOf("#");
var dotpos = emailV.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length)
{
alert("Not a valid e-mail address");
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
error = alert("You didn't enter a phone number.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (isNaN(parseInt(stripped)))
{
error = alert("The phone number contains illegal characters.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (!(stripped.length == 10))
{
error = alert("The phone number is the wrong length. Make sure you included an area code.\n");
phoneNumberV.style.background = 'Yellow';
}
return error;
}
Update your fiddle's html for the function to be called onsubmit="return validateForm()" and removed the required="required" changed your function to work, you can see it here:
http://jsfiddle.net/GVQpL/3/
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
document.forms["queryForm"]["fullName"].focus();
return false;
}
else if(fullNameV.indexOf(" ") >= fullNameV.length)
{
alert("Not a valid name");
document.forms["queryForm"]["fullName"].focus();
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
document.forms["queryForm"]["email"].focus();
return false;
}
var emailReg = /^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(emailV)){
alert("Not a valid e-mail address");
document.forms["queryForm"]["email"].focus();
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
document.forms["queryForm"]["phoneNumber"].focus();
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
alert("You didn't enter a phone number.\n");
document.forms["queryForm"]["phoneNumber"].focus()
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (isNaN(parseInt(stripped)))
{
alert("The phone number contains illegal characters.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (!(stripped.length == 10))
{
alert("The phone number is the wrong length. Make sure you included an area code.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
if(!confirm('Are you sure you want to submit your DSLR query?')){
return false;
}
return true;
}

SCRIPT5007: Unable to get property 'value' of undefined or null reference only in IE9 only

I only receive this error in Internet Explorer 9. IE8 and IE10 run the script fine. when click on the Submit button then i am getting this error
SCRIPT5007: Unable to get property 'value' of undefined or null reference CNSIControlServlet, line 15364 character 3
function checkForPhysicianInfo(){
var visibleRenderingPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&BillingRendering']).value;
var visibleOperatePhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isOperatePhyInfoVisible']).value;
var visibleOtherOperatingPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isOtherOperatingPhyInfoVisible']).value;
var visibleReferringPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isReferringPhyInfoVisible']).value;
var formName1='frmSubmitInstClaim';
var formElement = document.forms[formName1];
var l_sRenderingProviderID = document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-SRVCNG_PRVDR_LCTN_IDENTIFIER'];
var selectRenderingProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-SRVCNG_PRVDR_IDNTFR_TYPE_CID'];
RenderingProviderIDType = selectRenderingProviderIDType.options[selectRenderingProviderIDType.selectedIndex].value ;
var l_sOperateProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-OP_PRVDR_IDNTFR'];
var selectOperateProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-OP_PRVDR_IDNTFR_TYPE_CID'];
OperateProviderIDType = selectOperateProviderIDType.options[selectOperateProviderIDType.selectedIndex].value ;
var l_sOtherOperatingProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-OT_PRVDR_IDNTFR'];
var selectOtherOperatingProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-OT_PRVDR_IDNTFR_TYPE_CID'];
OtherOperatingProviderIDType = selectOtherOperatingProviderIDType.options[selectOtherOperatingProviderIDType.selectedIndex].value ;
var l_sReferringProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-RF_LCTN_IDENTIFIER'];
var selectReferringProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-RF_IDNTFR_TYPE_CID'];
ReferringProviderIDType = selectReferringProviderIDType.options[selectReferringProviderIDType.selectedIndex].value ;
if("Yes" == visibleRenderingPhyInfoValue)
{
if(Trim(l_sRenderingProviderID.value) == "" )
{
alert("Please Enter Rendering Physican Provider ID ");
l_sRenderingProviderID.focus();
return false;
}
if(Trim(RenderingProviderIDType) == "-2" )
{
alert("Please Enter Rendering Physican Provider ID Type");
selectRenderingProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(RenderingProviderIDType) == "3") && (Trim(l_sRenderingProviderID.value)!= "" )
&& (!IsNumeric(l_sRenderingProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sRenderingProviderID.focus();
return false;
}
if((Trim(RenderingProviderIDType) == "3") && (Trim(l_sRenderingProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sRenderingProviderID.focus();
return false;
}
//MIPRO00050010
}//Rendering
if("Yes" == visibleOperatePhyInfoValue)
{
if(Trim(l_sOperateProviderID.value) == "")
{
alert("Please Enter Operating Provider ID");
l_sOperateProviderID.focus();
return false;
}
if(Trim(OperateProviderIDType) == "-2" )
{
alert("Please Enter Operating Provider ID Type");
selectOperateProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(OperateProviderIDType) == "3") && (Trim(l_sOperateProviderID.value)!= "" )
&& (!IsNumeric(l_sOperateProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sOperateProviderID.focus();
return false;
}
if((Trim(OperateProviderIDType) == "3") && (Trim(l_sOperateProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sOperateProviderID.focus();
return false;
}
//MIPRO00050010
}//Operating
if("Yes" == visibleOtherOperatingPhyInfoValue)
{
if(Trim(l_sOtherOperatingProviderID.value) == "" )
{
alert("Please Enter Other Operating Physician Provider ID");
l_sOtherOperatingProviderID.focus();
return false;
}
if(Trim(OtherOperatingProviderIDType) == "-2" )
{
alert("Please Enter Other Operating Physician Provider ID Type");
selectOtherOperatingProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(OtherOperatingProviderIDType) == "3") && (Trim(l_sOtherOperatingProviderID.value)!= "" )
&& (!IsNumeric(l_sOtherOperatingProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sOtherOperatingProviderID.focus();
return false;
}
if((Trim(OtherOperatingProviderIDType) == "3") && (Trim(l_sOtherOperatingProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sOtherOperatingProviderID.focus();
return false;
}
//MIPRO00050010
}//Other Operating
if("Yes" == visibleReferringPhyInfoValue)
{
if(Trim(l_sReferringProviderID.value) == "")
{
alert("Please Enter Referring Physician Provider ID");
l_sReferringProviderID.focus();
return false;
}
if(Trim(ReferringProviderIDType) == "-2" )
{
alert("Please Enter Referring Physician Provider ID Type");
selectReferringProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(ReferringProviderIDType) == "3") && (Trim(l_sReferringProviderID.value)!= "" )
&& (!IsNumeric(l_sReferringProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sReferringProviderID.focus();
return false;
}
if((Trim(ReferringProviderIDType) == "3") && (Trim(l_sReferringProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sReferringProviderID.focus();
return false;
}
//MIPRO00050010
}//Referring
return true;
}
</script>

Radio button validation causing rest of validation to fail

The radio validation works but then the rest don't. What have I done wrong?
function validateRadio(radios) {
for (i = 0; i < radios.length; ++i) {
if (radios[i].checked) return true;
}
return false;
}
function validateForm() {
if (validateRadio(document.forms["pancettaForm"]["updateShip"])) {
return true;
} else {
alert("Please tell us how you would like to update your order.");
return false;
}
}
var x = document.forms["pancettaForm"]["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
var x = document.forms["pancettaForm"]["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
var x = document.forms["pancettaForm"]["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
var display = document.getElementById('address').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
var display = document.getElementById('city').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
var display = document.getElementById('state').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
var display = document.getElementById('zip').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
var display = document.getElementById('newShipDate').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}
Just reverse the test so you do not have to return
if(!validateRadio (document.forms["pancettaForm"]["updateShip"]))
{
alert("Please tell us how you would like to update your order.");
return false;
}
// continue
You had the end bracket after the test of the radios so the rest of the script just floated in cyberspace
Also return true only once at the end and do not have var x multiple times and be consistent in how you access the form elements and I also fixed your date test which was testing state
function validateForm() {
var x,display,form = document.forms["pancettaForm"];
if (!validateRadio(form["updateShip"])) {
alert("Please tell us how you would like to update your order.");
return false;
}
x = form["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
x = form["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
x = form["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
display = form["address"].style.display;
if (display == 'block') {
x = form["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
display = form["city"].style.display;
if (display == 'block') {
x = form["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
display = form['state'].style.display;
if (display == 'block') {
x = form['state'].value;
if (x == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
display = form['zip'].style.display;
if (display == 'block') {
x = form["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
display = form["newShipDate"].style.display;
if (display == 'block') {
x = form["newShipDate"].value;
if (x.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}
return true;
}

Why is my form not validating on submit? [closed]

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.
Closed 10 years ago.
I have a sign up form on my page at http://business.uglyopportunities.com/affiliate-signup/ (scroll down to see the form)
Keep in mind, I am not very good with JS so this may be a simple error.
Anyways, here is the first line of my form telling it to validate:
<form accept-charset="UTF-8" action="xxxxx" class="infusion-form" method="POST" name="myform" onsubmit="return validateForm();">
and here is my validateForm javascript:
<script type="text/javascript">
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
var e = document.forms["myform"][" inf_field_City"].value;
var f = document.forms["myform"][" inf_field_State"].value;
var g = document.forms["myform"][" inf_field_PostalCode"].value;
var h = document.forms["myform"][" inf_other_Username"].value;
var i = document.forms["myform"][" inf_other_Password"].value;
var j = document.forms["myform"][" inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address”) {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City”) {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State”) {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code”) {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username”) {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password”) {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password”) {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
and that is not working. However, when I used this code, it worked fine:
<script type="text/javascript">
function validateForm() {
var a=document.forms["myform"]["inf_field_FirstName"].value;
var b=document.forms["myform"]["inf_field_Email"].value;
var c=document.forms["myform"]["inf_field_Phone1"].value;
if (a==null || a=="" || a=="First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c==null || c==''|| c=="Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
UPDATED CODE *
<script type="text/javascript">// <![CDATA[
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"]["inf_field_StreetAddress1"].value;
var e = document.forms["myform"]["inf_field_City"].value;
var f = document.forms["myform"]["inf_field_State"].value;
var g = document.forms["myform"]["inf_field_PostalCode"].value;
var h = document.forms["myform"]["inf_other_Username"].value;
var i = document.forms["myform"]["inf_other_Password"].value;
var j = document.forms["myform"]["inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address") {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City") {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State") {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code") {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username") {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password") {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password") {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
// ]]>
</script>
You have a white space here:
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
// ^-----------------------
You have the same problem with for e,f,g,h,i,j
Also, you used the wrong quotes sign:
"Street Address”
// ^--------------
You did it several times.
As gdoron says, it's probably an spelling problem. You cannot begin the name of an element with a whitespace http://www.w3.org/TR/html401/types.html#type-name

Categories