HTMLフォームがあります。正常に動作しており、フォームに検証を適用したいと考えています。このフォームで jQuery Validate を動作させることができません。
HTML フォーム :
<form method="POST" action="/hourtable/" class="form-horizontal" id= "hour_form" name="hourform" enctype="multipart/form-data">
<input type="text" id="id_dateDue" class="input-xlarge" name="date" readonly="true" />
<input type="text" class="input-xlarge" name="appid" value="{{gethours}}" />
<input type="text" class="input-xlarge" name="hours" value="" />
<button class="btn btn-gebo" type="submit" name="asubmit">Submit</button>
jQuery:
<script>
$(document).ready(function(){
//* validation
$('#hour_form').validate({
onkeyup: false,
errorClass: 'error',
validClass: 'valid',
rules: {
date: { required: true, minlength: 3 },
appid: { required: true, minlength: 3 },
hours: { required: true, minlength: 3 },
refund: { required: true, minlength: 3 }
},
highlight: function(element) {
$(element).closest('div').addClass("f_error");
setTimeout(function() {
boxHeight()
}, 200)
},
unhighlight: function(element) {
$(element).closest('div').removeClass("f_error");
setTimeout(function() {
boxHeight()
}, 200)
},
errorPlacement: function(error, element) {
$(element).closest('div').append(error);
}
});
});
</script>