Client side validation not working

[Divy Prakash]

I was using server side validation and it is working fine.
Now i wanted to move to client isde validation.But i m not getting it.Am i missing something?

  
<script type="text/javascript" src="js/common.js">
function formValidator(){
	// Make quick references to our fields
	var email = document.getElementById('emailAddress');
	if(emailValidator(email, "Please enter a email address")){
		return true;
	}
return false;
}
function emailValidator(elem, helperMsg){
	var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
	if(elem.value.match(emailExp)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}
</script>
<div style="width: 900px; background: white; min-height: 550px;margin-top: 2px">
	<form:form method="post" commandName="registerForm"  onsubmit="return formValidator ()" enctype="multipart/form-data">
		<table cellspacing="0" cellpadding="0">
			<tr style="background: url('appImages/img041.jpg') repeat-x; color: white; font-size: 21px">
				<td colspan="3">
					<b> Register Your Property</b>
				</td>
			</tr>
			<tr>
				<td height="5px" colspan="3"></td>
			</tr>
			<tr>
				<td width="300px" height="100%" valign="top">
					<table width="100%" height="100%" style="border:1px solid #808080">
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr class="imageAds">
							<td>
								<img class="imageAds" src="appImages/ads1.jpg" />
							</td>
						</tr>
						<tr>
							<td>
								 
							</td>
						</tr>

					</table>
				</td>
				<td style="width:2px">
					 
				</td>
				<td>
					<table width="600px" cellspacing="0" cellpadding="3" style="font-size: 14px; color: black; background: url('appImages/building.jpg'); background-repeat: repeat-y; border: 1px solid grey;">
						<tr>
							<td>
								<DIV>
									<table>
										<tr style="background: url('appImages/img041.jpg') repeat-x; color: white;">
											<td colspan="3">
												<h3>
													<b> Property Detail</b>
												</h3>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												I want to
											</td>
											<td>
												<form:radiobutton path="registerType" value="SELL" />
												Sell
												<form:radiobutton path="registerType" value="RENT" />
												Rent/Lease
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Property
											</td>
											<td>
												<form:select path="propertyCategory" onchange="changeRegisterProperty()">
													<form:options items="${staticDataForm.propertyCategoryList}" itemLabel="name" itemValue="code" />
												</form:select>
											</td>
											<td>
												<form:errors cssStyle="color:red" path="propertyCategory" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Property Type
											</td>
											<td id="residentialProperty" style="">
												<form:select path="residentialPropertyType">
													<form:options items="${staticDataForm.residentialPropertyList}" itemLabel="name" itemValue="code" />
												</form:select>
											</td>
											<td id="commercialProperty" style="display:none">
												<form:select path="commercialPropertyType">
													<form:options items="${staticDataForm.commercialPropertyList}" itemLabel="name" itemValue="code" />
												</form:select>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Address Line<b style="color:red">*</b>
											</td>
											<td>
												<form:input path="address" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="address" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Locality
											</td>
											<td>
												<form:select path="location" onchange="changeMap()">
													<form:options items="${staticDataForm.locationList}" itemLabel="name" itemValue="id" />
												</form:select>
											</td>
										</tr>


										<tr>
											<td class="leftPadd">
												City
											</td>
											<td>
												<form:select path="city">
													<form:options items="${staticDataForm.cityList}" itemLabel="name" itemValue="id" />
												</form:select>
											</td>
											<td>
												<form:errors cssStyle="color:red" path="city" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												State
											</td>
											<td>
												<form:select path="state">
													<form:options items="${staticDataForm.stateList}" itemLabel="name" itemValue="id" />
												</form:select>
											</td>
										</tr>
									</table>
								</DIV>
							</td>
						</tr>


						<tr>
							<td>
								<DIV>
									<table>
										<tr style="background: url('appImages/img041.jpg') repeat-x; color: white;">
											<td colspan="3">
												<h3>
													<b> Property Feature</b>
												</h3>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Price<b style="color:red">*</b>
											</td>
											<td>
												<input type="text" name="price" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="price" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Area<b style="color:red">*</b>
											</td>
											<td>
												<input type="text" name="area" /> Sq. Ft
											</td>
											<td>
												<form:errors cssStyle="color:red" path="area" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Facing
											</td>
											<td>
												<form:select path="houseFacing">
													<form:options items="${staticDataForm.houseFacingList}" itemLabel="name" itemValue="value" />
												</form:select>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Owner Ship Type
											</td>
											<td>
												<form:select path="ownerShip">
													<form:options items="${staticDataForm.ownerShipTypeList}" itemLabel="name" itemValue="value" />
												</form:select>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Negotiable ?
											</td>
											<td>
												<form:radiobutton path="negotiable" value="NEGOTIABLE" />
												Yes
												<form:radiobutton path="negotiable" value="NOTNEGOTIABLE" />
												No
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Furnished
											</td>
											<td>
												<form:radiobutton path="furnished" value="Fully Furnished" />
												Full
												<form:radiobutton path="furnished" value="Semi Furnished" />
												Semi
												<form:radiobutton path="furnished" value="Raw" />
												No
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Property Description<b style="color:red">*</b>
												</br>(Up to 500 letters)
											</td>
											<td>
												<textarea name="description" id="description" rows="2" cols="5" ></textarea>
											</td>
											<td>
												<form:errors cssStyle="color:red" path="description" />
											</td>
										</tr>
										<tr id="uploadImage">
											<td>
												Upload Image
											</td>
											<td>
												<form:radiobutton path="uploadImage" value="Yes" onclick="changeImageView('Yes')" />
												Yes
												<form:radiobutton path="uploadImage" value="No" onclick="changeImageView('No')" />
												No
											</td>
										</tr>
										<tr id="image" style="display:none">
											<td>
												Property Image
											</td>
											<td>
												<input type="file" name="image" id="image" size="40">
											</td>
											<td>
												<form:errors cssStyle="color:red" path="image" />
											</td>
										</tr>
										<tr id="attachImages1row" style="display:none">
											<td>

											</td>
											<td>
												<input type="file" name="secondaryImage1" id="secondaryImage1" size="40">
											</td>
											<td>
												<form:errors cssStyle="color:red" path="secondaryImage1" />
											</td>
										</tr>
										<tr id="attachImages2row" style="display:none">
											<td>

											</td>
											<td>
												<input type="file" name="secondaryImage2" id="secondaryImage2" size="40">
											</td>
											<td>
												<form:errors cssStyle="color:red" path="secondaryImage2" />
											</td>
										</tr>
										<tr id="attachImages3row" style="display:none">
											<td>

											</td>
											<td>
												<input type="file" name="secondaryImage3" id="secondaryImage3" size="40">
											</td>
											<td>
												<form:errors cssStyle="color:red" path="secondaryImage3" />
											</td>
										</tr>
										<tr id="attachMoreImages" style="display:none">
											<td>

											</td>
											<td id="moreUploadsLink" style="color:blue">
												<a href="javascript:addFileInput();">Attach another File</a>
											</td>
										</tr>
										<tr id="tr_features_all">
											<td align="left" style="height: 27px; padding-left: 20px;" class="text" colspan="3">
												<table width="100%" cellspacing="0" cellpadding="0" border="0">
													<tbody>
														<tr style="font-size: 14px;" class="columnhead">
															<td width="33%" class="paddingleft10">
																<input type="checkbox" value="1" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Power Backup
															</td>
															<td width="33%" class="paddingleft10">
																<input type="checkbox" value="2" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Lift
															</td>
															<td width="34%" class="paddingleft10">
																<input type="checkbox" value="3" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Rain Water Harvesting
															</td>
														</tr>
														<tr>
															<td height="10" class="lineheight" colspan="4"></td>
														</tr>
														<tr style="font-size: 14px;" class="columnhead">
															<td width="16%" class="paddingleft10">
																<input type="checkbox" value="4" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Club
															</td>
															<td width="28%" class="paddingleft10">
																<input type="checkbox" value="5" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Swimming Pool
															</td>
															<td width="20%" class="paddingleft10">
																<input type="checkbox" value="6" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Security
															</td>
														</tr>
														<tr>
															<td height="10" class="lineheight" colspan="4"></td>
														</tr>
														<tr style="font-size: 14px;" class="columnhead">
															<td class="paddingleft10">
																<input type="checkbox" value="7" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Reserved Parking
															</td>
															<td class="paddingleft10">
																<input type="checkbox" value="8" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Gym
															</td>
															<td class="paddingleft10">
																<input type="checkbox" value="9" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Servant Quarters
															</td>
														</tr>
														<tr>
															<td height="10" class="lineheight" colspan="4"></td>
														</tr>
														<tr style="font-size: 14px;" class="columnhead">
															<td class="paddingleft10">
																<input type="checkbox" value="10" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Park
															</td>
															<td class="paddingleft10">
																<input type="checkbox" value="11" id="amenities" class="textcontrol" name="amenities[]" style="background-color: rgb(255, 255, 255);" />
																Vaastu Compliance
															</td>
															<td></td>
														</tr>
													</tbody>
												</table>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Bedrooms
											</td>
											<td>
												<form:select path="bedrooms">
													<form:options items="${staticDataForm.bedRoomListRP}" itemLabel="name" itemValue="value" />
												</form:select>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Floor
											</td>
											<td>
												<form:select path="buildingFloor">
													<form:options items="${staticDataForm.buildingFloorList}" itemLabel="name" itemValue="value" />
												</form:select>
											</td>
										</tr>
									</table>
								</DIV>
							</td>
						</tr>

						<tr>
							<td>
								<DIV>
									<table>
										<tr style="background: url('appImages/img041.jpg') repeat-x; color: white;">
											<td colspan="2">
												<h3>
													<b> Property Location</b>
												</h3>
											</td>
											<td>
												<a href="http://www.mygeoposition.com" target="blank" style="color:white"> Find your GeoPosition </a>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Latitude
											</td>
											<td>
												<input type="text" name="latitude" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="latitude" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Longitude
											</td>
											<td>
												<input type="text" name="longitude" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="longitude" />
											</td>
										</tr>
									</table>
								</DIV>
							</td>
						</tr>

						<tr>
							<td>
								<DIV>
									<table>
										<tr style="background: url('appImages/img041.jpg') repeat-x; color: white;">
											<td colspan="3">
												<h3>
													<b> Contact Detail</b>
												</h3>
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Contact Person<b style="color:red">*</b>
											</td>
											<td>
												<form:input path="contactPerson" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="contactPerson" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Mobile Number<b style="color:red">*</b>
											</td>
											<td>
												<form:input path="primaryNumber" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="primaryNumber" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Landline Number
											</td>
											<td>
												<input type="text" name="secondaryNumber" id="secondaryNumber" />
											</td>
										</tr>
										<tr>
											<td class="leftPadd">
												Email Address<b style="color:red">*</b>
											</td>
											<td>
												<form:input path="emailAddress" />
											</td>
											<td>
												<form:errors cssStyle="color:red" path="emailAddress" />
											</td>
										</tr>
									</table>
								</DIV>
							</td>
						</tr>
						<tr>
							<td></td>
							<td align="right" style="font-size: 15px;">
								<div style="border: 1px solid white; width: 70px; text-align: center; background: black; color: white;">
								</div>
								<input type="submit" value="Register" />
							</td>
						</tr>
						<tr>
							<td><b style="color:red">Fields indicated by * are mandatory</b></td>
							<td></td>
						</tr>
					</table>
				</td>
				<td style="width: 2px"></td>
			</tr>
		</table>
	</form:form>
</div>

  

[Bear Bibeault]

Please take the time to choose the correct forum for your posts. This forum is for questions on JSP. For more information, please read this.

This post has been moved to a more appropriate forum.

[Eric Pascarello]

Have you added alerts to see what values you are getting and what the regualr expression is doing? I am betting you have an error in there.

Eric

[David Newton]

Do you have short, readable code that duplicates the problem? Wading through 500 lines of only marginally-related code isn't my idea of a good time.