JQuery Form Validation with onSubmit

[juneaid]

Hello,

I am a newbee on web coding. I want to add a form with jquery validation to my php based website in order to stop the form until the jquery validation requirements are fulfilled.

After some search I have prepared the script as seen below.

<script src="{external file='js/jquery.validate.js'}" type="text/javascript"></script>
<script id="demo" type="text/javascript">

$(document).ready(function() {
	var validator = $("#registration_form").validate({
		rules: {
			firstname: "required",
                        },
		messages: {
			firstname: "Enter your firstname",
                        },
		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() );
		},
		submitHandler: function() {
			alert("submitted!");
		},
		success: function(label) {
			label.html("&nbsp;").addClass("checked");
		}
	});
	
});
</script>

The form starts with the following tag

<form id="registration_form" action="registration.php" onsubmit="return validate();" method="post">

I have found the way to use the "onsubmit" when I search on the internet, as below.

function Validate()
{
    if (document.exampleForm.chkBox.checked)
        return true;
    alert('You must check the box before submitting this form');
    return false;
}

However, I could not integrate the "function Validate()" to my script above.

Please can you advise me how I can handle with this situation?

Thanks.