$().ready(function() {	
	var validator = $("#form1").validate({
		rules: {
			
			prGender: "required" ,
			
			prFirstName: { required: true ,
               letterswithbasicpunc: true },
			prLastName: { required: true ,
              letterswithbasicpunc: true  },
			prPassword: { required: true ,
				             alphanumeric: true },
			prPassword2: {
				required: true,
				equalTo: "#prPassword"
						   	},
			prChatname: {
				required: true,
				alphanumeric: true,
				remote: "validateChatnameReg.php"		        
			},
			prEmail: {
				required: true,
				email: true,
				remote: "validateEmail.php"
			},
			prEmail2: {
				required: true,
				equalTo: "#prEmail"
			},
			prCountry:{ 
				required:true
				},
			prState:{ 
				required:false
				},			
			prCity:{ 
				required:true
				},
			prBirthYear: "required",
			prBirthDate: "required",
			prBirthMonth: "required",
			agree: "required"					
		},
		messages: {
			prGender:" Please select your gender ",
			prFirstName: { required: "Please enter your firstname ",
			           letterswithbasicpunc: "Letters or punctuation only please "}, 
			prLastName: { required: "Please enter your firstname ",
			           letterswithbasicpunc: "Letters or punctuation only please "}, 
			
			prChatname: {required: "Please enter your Chat Name ",
			             alphanumeric: "Letters, numbers, or underscores only ",
			               remote: jQuery.format("{0} is already in use" )
			 },
			username: {
				required: "Please enter a username ",
				minLength: "Your username must consist of at least 2 characters"
			},
			prPassword: {
				required: "Please provide a password ",
				alphanumeric: "Letters, numbers, or underscores only ",
				minLength: "Your password must be at least 5 characters long"
				
			},
			prPassword2: {
				required: "Please confirm your password ",
				minLength: "Your password must be at least 5 characters long ",
				equalTo: "Please enter the same password as above"
			},
			prEmail: {  required:"Please enter a valid email address ",
			            remote: jQuery.format("{0} is already in use") },
			prEmail2: {
				required: "Please Confirm your Email ",
				equalTo: "Please enter the same email as above"				
			},
			prCountry: {
				required: "Please choose your Country ",
				minLength: "Please choose your Country</span>"
			},
			prState: {
				required: "Please enter your state ",
				minLength: "Please enter your state</span>"
			},
			prCity: {
				required: "Please enter your City ",
				minLength: "Please enter your City</span>"
			},
			prBirthDate: "Please choose your Birth Date ",
			prBirthMonth: "Please choose your Birth Month ",
			prBirthYear: "Please choose your Birth Year"
			
		},
		errorPlacement: function(error, element) {
			if ( element.is(":radio") )
				error.appendTo( element.parent().next().next() );
			else if ( element.is(":checkbox") )
				error.appendTo ( element.next() );
			else
				error.appendTo( element.parent().next() );
		},
		success: function(label) {
			label.html("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;").addClass("infoChecked");
		}
		
	});	
	
	
	
	
$(function(){
  $("select#prCountry").change(function(){
    $.getJSON("/select_list.php",{id: $(this).val(), ajax: 'true'}, function(j){
      var options = '<select name="prStateT" id="prStateT" style="width:180px;" onblur="prState.value=this.value">';
      for (var i = 0; i < j.length; i++) {
        options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
      }
       options += '</select>';
       if (j.length > 10) { $("div#prArea").html(options);  }
 else  {$("div#prArea").html("<input type='text' name='prStateTmp' id='prStateTmp' size=25 onkeyup='prState.value=this.value'>");	}
    })
  })
});		
	
	
	
	
});

