If checkbox is not checked and signup button is clicked
Message should display asking the user to agree to terms and conditions by clicking the checkbox. At the same time the border around the checkbox should change to red colour to draw attention of the user.
Any time the user check the Checkbox the error message should vanish and display the OK or tick image. At the same time the Red colour border around the checkbox should vanish.
You can read more about validation of other input types and here only the checkbox part is shown.
JQuery
<script>
$(document).ready(function() {
///////
my_function_terms=function my_function_terms(status,str){
if(status=='NOTOK'){
$('#terms1').css({"border-color": "red",
"border-width":"1px",
"border-style":"solid"});
}else{
$('#terms1').css({'border-color': '',"border-width":"0px"});
}
$('#msg_terms').html(str);
}
///////
///////// Terms & conditions //////////
$("#terms").change(function(){
var ckb_status = $("#terms").prop('checked');
if(ckb_status){
my_function_terms("OK"," Thanks ........");
}
else{
my_function_terms("NOTOK","You must agree to terms and conditions ");
}
});
//////// End of terms and condtions //////
$("#b1").click(function(event){
var ckb_status = $("#terms").prop('checked');
if(ckb_status){
my_function_terms("OK","Thanks .. ");
}
else{
my_function_terms("NOTOK","You must agree to terms and conditions ");
}
//////
// Other input elements with status.
////
})
////////////////////////////////
})
</script>
JQuery Video Tutorials