I'm getting error Uncaught TypeError:$(..) form Validation is not a function the error comes from a line in the JS code below. How can i fix it?? what should i change??? Please share your knowledge...
<!-- js placed at the end of the document so the pages load faster -->
<script src="assets/js/jquery.js"></script>
<!-- validation plugin jquery -->
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script class="include" type="text/javascript" src="assets/js/jquery.dcjqaccordion.2.7.js"></script>
<script src="assets/js/jquery.scrollTo.min.js"></script>
<script src="assets/js/jquery.nicescroll.js" type="text/javascript"></script>
<!--common script for all pages-->
<script src="assets/js/common-scripts.js"></script>
<!--script for this page-->
<!-- Include Date Range Picker -->
<!-- https://formden.com/blog/date-picker -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<!-- Time Picker -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.15.35/js/bootstrap-datetimepicker.min.js"></script>
<script src="//oss.maxcdn.com/bootbox/4.2.0/bootbox.min.js"></script>
<!-- addmoreact.js -->
<script src="assets/js/addmoreact.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$('#userForm').formValidation();
$('#userForm').on( 'success.form.fv', function(e) {
// You can inform the user that the data is updated successfully
// by highlighting the row or showing a message box bootbox
.alert('The Petitioner Details is updated');
});
$('#petView .editButton') .on('click', function() {
// Get the record's ID via attribute
var cino = $(this).attr('data-id');
var ptyno = $(this).attr('data-email');
var ptytype = $(this).attr('data-age');
/* alert("cino::" + cino + "ptyno::" + ptyno + "ptytype::" + ptytype); */
$.ajax({
url : "editpet.jsp?cino=" + cino + "&ptyno=" + ptyno + "&ptytype=" + ptytype,
method : 'POST'
}).success(function(response) {
var res = jQuery.parseJSON(response);
// Populate the form fields with the data returned from server
$('#userForm').find('[name="advocateName"]').val(res.advname)
.end()
.find('[name="age"]')
.val(res.age)
.end()
.find('[name="barregistrationnumber"]')
.val(res.barreg)
.end()
.find('[name="mobile"]')
.val(res.mobile)
.end()
.find('[name="name"]')
.val(res.name)
.end()
.find('[name="relname"]')
.val(res.relname)
.end()
.find('[name="email"]')
.val(res.email)
.end()
.find('[name="ptyno"]')
.val(res.ptyno)
.end()
.find('[name="type"]')
.val(res.ptyType)
.end()
.find('[name="cino"]')
.val(res.cino)
.end()
.find('[name="passport"]')
.val(res.passport)
.end()
.find('[name="pan"]')
.val(res.pan)
.end()
.find('[name="fax"]')
.val(res.fax)
.end()
.find('[name="occupation"]')
.val(res.occupation)
.end()
.find('[name="country"]')
.val(res.country)
.end()
.find('[name="nationality"]')
.val(res.nationality)
.end()
.find('[name="phone"]')
.val(res.phone)
.end()
.find('[name="alternateaddress"]')
.val(res.alternateaddress)
.end();
// Show the dialog bootbox
.dialog({
title : 'Edit Petitioner Details',
message : $('#userForm'),
show : false,
onEscape:true
// We will show it manually later
/* http://stackoverflow.com/questions/29708075/how-to-confirm-a-form-submission-with-bootbox-using-jquery-ajax-and-json?rq=1 */
}).on('shown.bs.modal', function() {
$('#userForm').show()
// Show the login form
.formValidation( 'resetForm'); // Reset form
}).on('hide.bs.modal', function(e) {
// Bootbox will remove the modal (including the body which contains the login form)
// after hiding the modal
// Therefor, we need to backup the form
$('#userForm').hide()
.appendTo('body');
}).modal('show');
/* if ($('#userForm #userformpetExtraInfo').is(':checked')) {
alert("Extra Pet Infor check");
$("#userForm #userformextrapet").show();
} else {
alert("Extra Pet Infor un check");
$("#userForm #uuserformextrapet").hide();
} */
});//sucess
});
</script>
<!-- The form which is used to populate the item data -->
<form id="userForm" method="post" class="form-horizontal" action="updatePetitionerView.do" >
<div class="form-group">
<label class="col-xs-3 control-label">Advocate Name</label>
<div class="col-xs-3">
<input type="text"
class="form-control"
name="advocateName" disabled="disabled"
data-toggle="tooltip"
data-placement="top"
id="advocateName"
title="Enter Advocate Name"
data-fv-notempty="true"
data-fv-notempty-message="The username is required"
data-fv-stringlength="true"
data-fv-stringlength-min="6"
data-fv-stringlength-max="30"
data-fv-stringlength-message="The username must be more than 6 and less than 30 characters long"
data-fv-regexp="true"
data-fv-regexp-regexp="^[a-zA-Z0-9_\.]+$"
data-fv-regexp-message="The username can only consist of alphabetical, number, dot and underscore" />
</div>
</div>
</form>
