troubleshooting Question

Form field being ignored by validation

Avatar of Michael Sole
Michael Sole asked on
JavaScriptPHPAJAX
6 Comments1 Solution701 ViewsLast Modified:
I am using the JQuery validator plugin. It is working fine except for when I get to the social security field. I am unable after many hours to identify why it is not work. Please, can you show me why and how you figured that out as I am out of debug ideas. Thanks.

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Referral Manager - Claimant Form</title>
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
<link type="text/css" href="css/smoothness/jquery-ui-1.8.16.custom.css" rel="stylesheet" />	
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.metadata.js"></script>
<script type="text/javascript" src="js/jquery.mini.validator.js"></script>
<script type="text/javascript" src="js/jquery.masked.mini.js"></script>
<script type="text/javascript" src="js/jquery.urlencode.js"></script>
<script type="text/javascript" src="js/jquery.popup.js"></script>
<script type="text/javascript" src="js/jquery.livequery.js"></script>
<style type="text/css">
div.error { 
     font-size: 10px;
     width: 100%;
     text-align: center;
     display: inline;
     #float: left;
	 align: center;
     position: fixed;
     z-index: 1;
     padding: 2px;
     #margin-left: 270px;
     background-color: #fcd6cf;
     border: 1px solid #bb1124;
     display: none;
 }
</style>
</head>
<body><body>
<div id="main">
<script>
	function clear_form_elements(ele) {
			$(ele).find(':input').each(function() {
				switch(this.type) {
					case 'password':
					case 'select-multiple':
					case 'select-one':
					case 'text':
					case 'textarea':
						$(this).val('');
						break;
					case 'checkbox':
					case 'radio':
						this.checked = false;
				}
			});
		}
	$(document).ready(function(){	
		var eContainer = $('div.eContainer');
		$("#referralForm").validate({
			errorElement: "div",
			errorPlacement: function(error, element) {
				error.insertBefore($("#referralForm"));
			},
			rules: {
				claimantName: {
					required:true,
					minlength:3
				},
				claimantAddress: {
					required:true,
					minlength:3
				},
				referralType: {
					required: true
				},
				referralDate: {
					required:true, 
					date:true
				},
				claimantPhone: {
					required:true, 
					phoneUS:true
				},
				socialSecurity: {
				  required: true,
				  minlength: 3
				},
				claimantCity: {
					required:true,
					minlength:3
				},
				claimantState: {
					required:true
				},
				gender: {
					required:true
				},
				doi: {
					required:true,
					date: true
				},
				dob: {
					required:true,
					date: true
				},
				stampActivity:  {
					required:true,
					date: true
				},
				accountsID: "required",
				did: "required",
				eid: "required",
				aid: "required",
				lid: "required"
			}
		 });
		 
			 
		$.ajax({
                url: 'claimantGet.php?action=get&cid=1',
                dataType: 'json',
                type: 'post',
                data: $('#form1').serialize(),
                error: function() {
                    return true;
                },
                success: function(data) {
                    if( data )
                    {
						$.each(data, function(index,array) {
							$('#'+index).val(array);
						});
						
                    }
                }
            });
		$('.navigation').click(function(e){
			e.preventDefault();
			$('#id :input').attr("disabled", false);
			$.ajax({
                url: 'getClaimant.php?action='+this.id+'&cid='+$('#id').val(),
                dataType: 'json',
                type: 'post',
                data: $('#form1').serialize(),
                error: function() {
                    return true;
                },
                success: function(data) {
                    if( data )
                    {
						$.each(data, function(index,array) {
							$('#'+index).val(array);
						});
                    }
                }
            });
		});
		$( "#dialog-confirm" ).hide();
		$("#Save").hide();
		$(".EditControls").hide();
		$("#formControlDiv :input").attr("disabled", true);
		$( ".datepicker" ).datepicker();
		$(".socialSecurityClass").mask("999-99-9999");
		$(".mPhone").mask("9999999999");
		$(".zip").mask("99999");
		$("#Edit").click(function(){
			$("#formControlDiv :input").attr("disabled", false);
			$("#action").val('Edit');
			$(".noEditControls").hide();
			$(".EditControls").show();
			$("#Save").show();
		});
		$("#New").click(function(){
			$("#formControlDiv :input").attr("disabled", false);
			$("#action").val('New');
			$(".noEditControls").hide();
			$(".EditControls").show();
			$("#Save").show();
			clear_form_elements("#referralForm")
		});
		$("#Cancel").click(function(){
			$( "#dialog-confirm" ).dialog({
				resizable: false,
				height:140,
				modal: true,
				buttons: {
					"Yes": function() {
					$("#formControlDiv :input").attr("disabled", true);
					$(".noEditControls").show();
					$(".EditControls").hide();
					$("#Save").hide();
						$( this ).dialog( "close" );
					},
					"No": function() {
						$( this ).dialog( "close" );
					}
				}
			});
		});
	});
</script>
<div id="dialog-confirm" title="Discard Changes?">
	<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Changes are about to be lost, these will not be recoverable. Are you sure?</p>
</div>
<div align="center">
<table border="0" class="menuBar">
<tr>
<td width="20%">
<h1> Referral Manager</h1>
</td>
<td width="12%">
<b>Case Manager:</b><input type='text' id="caseManager" value="Unassigned" disabled='disabled'>
</td>
<td width="12%">
<b>Sales Person:</b> <input type='text' id="salesPerson" value="Unassigned" disabled='disabled'>
</td>
<td align="right">
<div class="noEditControls">
<a href="main.php" id="Main" class="myButton">Main</a>
<!--<a href="#" id="First" class="myButton navigation">First</a>
<a href="#" id="Prev" class="myButton navigation">Prev</a>
<a href="#" id="Next" class="myButton navigation">Next</a>
<a href="#" id="Last" class="myButton navigation">Last</a>-->
<a href="#" id="New" class="myButton">New</a>
<a href="#" id="Edit" class="myButton">Edit</a>
</div>
<div class="EditControls">
<a href="#" id="Cancel" class="myButton">Cancel</a>
</div>
</td>
</tr>
</table>
</div>
<div id="formControlDiv">
<form method="POST" action="addUpdateClaimant.php" id="referralForm" class="register">
	<input type="hidden" name="id" id="id" >
	<input type="hidden" name="action" id="action" >
	<table border="0" width="100%">
		<tr>
			<td colspan="3" width="33%" valign="top" >Claimant Name:<br>
			<input type="text" name="claimantName" id="claimantName" size="64" placeholder="Enter Claimant Name" /></td>
			<td valign="top">Referral Type:<br>
			<select size="1" name="referralType" id="referralType" >
			<option></option>
			<option value="1">Crisis</option>
			<option value="2">Field Case Management</option>
			<option value="3">Legal Nurse Consulting</option>
			<option value="4">MCP</option>
			<option value="5">Medicare Set Aside</option>
			<option value="6">TCM</option>
			<option value="7">Vocational</option>
			<option value="8">Life Care Planning</option>
			</select></td>
			<td>
			</td>
			<td width="17%" colspan="2" valign="top">Referral Date:<br>
			<div class="demo"><input type="text" name="referralDate"  id="referralDate" size="20" class="datepicker"  ></div></td>
			<td width="16%" colspan="2" valign="top">Status:<br>
			<select size="1" name="status" id="status">
			<option value="Open" selected>Open</option>
			<option value="Closed">Closed</option>
			</select></td>
		</tr>
		<tr>
			<td colspan="3" valign="top">Claimant Address:<br>
			<input type="text" name="claimantAddress" id="claimantAddress" size="64" placeholder="Enter Claimant Address" ></td>
			<td colspan="2" valign="top">Claimant Phone:<br>
			<input type="text" name="claimantPhone" id="claimantPhone" size="20" placeholder="Enter Claimant Phone"  class="mPhone" /></td>
			<td colspan="2" valign="top">Social Security #:<br>
			<input type="text" name="socialSecurity" id="socialSecurity" size="20" placeholder="###-##-####" class="socialSecurityClass" /></td>
			<td colspan="2">Claim #:<br>
			<input type="text" name="claimNumber" id="claimNumber" size="20"></td>
		</tr>
		<tr>
			<td valign="top">Claimant City:<br>
			<input type="text" name="claimantCity" id="claimantCity" size="30" /></td>
			<td valign="top">State:<br>
			<select width="2" name="claimantState" id="claimantState"" />
	<option value=""></option>
	<option value="AL">AL</option>
	<option value="AK">AK</option>
	<option value="AZ">AZ</option>
	<option value="AR">AR</option>
	<option value="CA">CA</option>
	<option value="CO">CO</option>
	<option value="CT">CT</option>
	<option value="DE">DE</option>
	<option value="DC">DC</option>
	<option value="FL">FL</option>
	<option value="GA">GA</option>
	<option value="HI">HI</option>
	<option value="ID">ID</option>
	<option value="IL">IL</option>
	<option value="IN">IN</option>
	<option value="IA">IA</option>
	<option value="KS">KS</option>
	<option value="KY">KY</option>
	<option value="LA">LA</option>
	<option value="ME">ME</option>
	<option value="MD">MD</option>
	<option value="MA">MA</option>
	<option value="MI">MI</option>
	<option value="MN">MN</option>
	<option value="MS">MS</option>
	<option value="MO">MO</option>
	<option value="MT">MT</option>
	<option value="NE">NE</option>
	<option value="NV">NV</option>
	<option value="NH">NH</option>
	<option value="NJ">NJ</option>
	<option value="NM">NM</option>
	<option value="NY">NY</option>
	<option value="NC">NC</option>
	<option value="ND">ND</option>
	<option value="OH">OH</option>
	<option value="OK">OK</option>
	<option value="OR">OR</option>
	<option value="PA">PA</option>
	<option value="RI">RI</option>
	<option value="SC">SC</option>
	<option value="SD">SD</option>
	<option value="TN">TN</option>
	<option value="TX">TX</option>
	<option value="UT">UT</option>
	<option value="VT">VT</option>
	<option value="VA">VA</option>
	<option value="WA">WA</option>
	<option value="WV">WV</option>
	<option value="WI">WI</option>
	<option value="WY">WY</option>
</select></td>
			<td valign="top">Zip:<br>
			<input type="text" name="claimantZip" id="claimantZip" size="5" class="zip" /></td>
			<td colspan="2" valign="top">Alternate Phone:<br>
			<input type="text" name="claimantAltPhone" id="claimantAltPhone" size="20" class="mPhone" /></td>
			<td colspan="2" valign="top">DOB:<br>
			<div class="demo"><input type="text" name="dob" id="dob" size="20" class="datepicker"></div></td>
			<td colspan="2" valign="top">DOI:<br>
			<div class="demo"><input type="text" name="doi" id="doi" size="20" class="datepicker" class=""></div></td>
		</tr>
		<tr>
			<td colspan="3" valign="top">Weekly Indemnity:<br>
			<input type="text" name="weeklyIdemnity" id="weeklyIdemnity" size="20" placeholder="$0.00"  class=""></td>
			<td valign="top">Benefit State:<br>
			<select width="2" name="benefitState" id="benefitState"" />
	<option value=""></option>
	<option value="AL">AL</option>
	<option value="AK">AK</option>
	<option value="AZ">AZ</option>
	<option value="AR">AR</option>
	<option value="CA">CA</option>
	<option value="CO">CO</option>
	<option value="CT">CT</option>
	<option value="DE">DE</option>
	<option value="DC">DC</option>
	<option value="FL">FL</option>
	<option value="GA">GA</option>
	<option value="HI">HI</option>
	<option value="ID">ID</option>
	<option value="IL">IL</option>
	<option value="IN">IN</option>
	<option value="IA">IA</option>
	<option value="KS">KS</option>
	<option value="KY">KY</option>
	<option value="LA">LA</option>
	<option value="ME">ME</option>
	<option value="MD">MD</option>
	<option value="MA">MA</option>
	<option value="MI">MI</option>
	<option value="MN">MN</option>
	<option value="MS">MS</option>
	<option value="MO">MO</option>
	<option value="MT">MT</option>
	<option value="NE">NE</option>
	<option value="NV">NV</option>
	<option value="NH">NH</option>
	<option value="NJ">NJ</option>
	<option value="NM">NM</option>
	<option value="NY">NY</option>
	<option value="NC">NC</option>
	<option value="ND">ND</option>
	<option value="OH">OH</option>
	<option value="OK">OK</option>
	<option value="OR">OR</option>
	<option value="PA">PA</option>
	<option value="RI">RI</option>
	<option value="SC">SC</option>
	<option value="SD">SD</option>
	<option value="TN">TN</option>
	<option value="TX">TX</option>
	<option value="UT">UT</option>
	<option value="VT">VT</option>
	<option value="VA">VA</option>
	<option value="WA">WA</option>
	<option value="WV">WV</option>
	<option value="WI">WI</option>
	<option value="WY">WY</option>
</select></td>
			<td valign="top">Gender:<br>
			<select size="1" name="gender" id="gender" class="">
			<option selected value=""></option>
			<option value="1">Male</option>
			<option value="2">Female</option>
			</select></td>
			<td colspan="4" valign="top">Next Activity:<br>
			<div class="demo"><input type="text" name="stampActivity" id="stampActivity" size="20" class="datepicker" class=""></div></td>
		</tr>
		<tr>
			<td colspan="1" valign="top">
				Account:<br/>
				<select size="1" name="aid" id="aid" >
				<option></option>
				<option value="4">Test</option><option value="5">Michael Sole</option><option value="6">insurance</option>				</select>
			</td>
			<td colspan="2" valign="top">
				Doctor:<br/>
				<select size="1" name="did" id="did" >
				<option></option>
				<option value="1">Test</option><option value="2">dr.jones</option>				</select>
			</td>
			<td colspan="2" valign="top">
				Employer:<br/>
				<select size="1" name="eid" id="eid" >
				<option></option>
				<option value="1">Joe's Construction11</option><option value="2">Joe</option>				</select>
			</td>
			<td colspan="4" valign="top">
				Attorney:<br/>
				<select size="1" name="lid" id="lid" >
				<option></option>
				<option value="1">Shister & Assoc</option><option value="2">mr. attorney</option>			</select></td>
		</tr>
		<tr>
			<td colspan="3" valign="top">Special Needs Requests</td>
			<td colspan="2" valign="top">&nbsp;</td>
			<td colspan="4" valign="top">&nbsp;</td>
		</tr>		
		<tr>
			<td colspan="9" valign="top">
			<textarea rows="7" name="specialNeeds" id="specialNeeds" cols="126"></textarea></td>
		</tr>		
	</table>
	<input  type="submit" class="submit" id="Save" value="Submit">
</form>
</div>
<br/>
<div align="center">
<table border="0" id="activity" class="menuBar" width="100%">
<tr>
<td>
<h3>Activity Report</h3>
</td>
<td>
<a href="activityReport.php?action=New" class="myButton">New Report</a>
</td>
</tr>
</table>
</div>
<form method="POST" action="#" class="register">
<table border="0" width="100%">
	<thead>
		<th>ID</th>
		<th>Type</th>
		<th>Diagnosis</th>
		<th>Date</th>
		<th>Action</th>
	</thead>
	
</table>
</form></body>

</html>
Join the community to see this answer!
Join our exclusive community to see this answer & millions of others.
Unlock 1 Answer and 6 Comments.
Join the Community
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 6 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros