อยากทราบวิธี เช็คการเลือกวันที่เริ่มต้น ไม่ให้มากกว่าวันที่สิ้นสุด

<script>
$(document).ready(function(){
	jQuery.validator.addMethod("greaterStart", function (value, element, params) {
		return this.optional(element) || new Date(value) >= new Date($(params).val());
	}, 'Must be greater than start date.');
	$( "#frm_id" ).validate({
		rules: {
			start_date: {
				required: true,
			},
			end_date: {
				required: true,
				greaterStart: "#start_date"
			}
		},
		submitHandler: function(form) {
			form.submit();
		}
	});
});
</script>
<div id="modal_search" class="modal fade modal-draggable frm_search" role="dialog" tabindex="-1">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h5 class="modal-title"><i class="fa fa-search" aria-hidden="true"></i> เรียกดูข้อมูลตามช่วงเวลา</h5>
			</div>
			<form id="frm_search" action="<?php echo base_url($this->uri->uri_string()); ?>" role="form" method="POST">
				<div class="modal-body has-padding">
					<div class="form-group">
						<div class="row">
							<div class="col-sm-6">
								<label>วันที่เริ่มต้น: </label>
								<input type="text" class="form-control datepicker" name="start_date" id="start_date" placeholder="เลือกวันที่เริ่มต้น...">
							</div>
							<div class="col-sm-6">
								<label>วันที่สิ้นสุด: </label>
								<input type="text" class="form-control datepicker" name="end_date" id="end_date" placeholder="เลือกวันที่สิ้นสุด...">
							</div>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default tip" data-placement="top" title="ปิด" data-dismiss="modal" aria-hidden="true">Close</button>
					<button type="submit" name="submit" class="btn btn-primary btn-submit tip" data-placement="top" title="ค้นหา">Search</button>
				</div>
			</form>
		</div>
	</div>
</div>