I am using jquery to do custom field validation. Test_Name__c
in the below code is a required standard field. When i am submitting the form i am getting the standard field validation error as "You must Enter a value"
. My custom validation is not showing up.
Can anyone tell what is the issue.
<apex:page standardStylesheets="false" controller="test" sidebar="false">
<head>
<apex:includescript value="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" />
<apex:includescript value="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js" />
<script type="text/javascript">
$(document).ready(function() {
$('[id$=mainID]').validate();
$('[id$=testid]').rules("add",{
required: true
});
});
jQuery.validator.messages.required = "You better have entered a value.. or else!";
</script>
</head>
<div style="background-color: #7dbed2;" class="panel panel-primary">
<br />
<apex:form style="background: #f4f7f8;border-radius: 8px; width:65%; padding: 20px; margin:auto;" id="mainID">
<div class="panel panel-primary">
<div class="panel-body">
<div class="row">
<div class="col-md-4">
<div class="form-group" id="div1">
<apex:inputField value="{!test.Test_Name__c}" label="Name" id="testid" styleClass="form-control" />
</div>
</div>
</div>
</div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-12">
</div>
</div>
<div>
<br />
<div class="row">
<div class="col-md-6">
<apex:commandButton value="Save" style="width: 100%;height: 41px;" styleClass="" reRender="mainID"/>
</div>
</div>
</div>
</div>
<br/>
</apex:form>
</div>
</apex:page>