I'm using the JQuery validate plug-in to validate my form. I have 4 fields that are related: ev_start
, ev_end
, ev_starttime
and ev_endtime
. The first two are dates, are required, and ev_end
must be after ev_start
. The second two are times and may or may not be required, but ev_endtime
must be after ev_starttime
if they are entered.
If I change an incorrect ev_endtime
or ev_end
the field is revalidated based on its dependencies as required. But if I change an ev_start
or an ev_starttime
, the dependent ev_end
or ev_endtime
is not revalidated. How do I fix this?
My rules look like this:
rules: {
ev_start: { dateCan: true, required: true},
ev_end:{ dateCan: true,
minDate: ":input[name='ev_start']"
},
ev_starttime:{
required:
function(element){
return $("input[name='allday']:unchecked")
},
time: true
},
ev_endtime:{
required:
function(element){
return $("input[name='allday']:unchecked")
},
time: true,
minTime: {
depends: function(element) {
return $("input[name='ev_start']").valid()
&& $("input[name='ev_end']").valid()
&& $("input[name='ev_starttime']").valid()
&& $("input[name='ev_start']").val()==$("input[name='ev_end']").val()
},
param: ":input[name='ev_starttime']"
}
}
}
dateCan
is a custom rule that checks for 'YYYY-mm-dd' date format. minDate
and minTime
make sure that dates and times are in the correct order. All of this works.