Javascript validation allows dates pre-1/1/1753 but Contour errors
Hi,
A fun one for a Friday morning. My client has a user who entered the following date, by accident, into a Contour form: '08/12/1013'. They meant '08/12/2013'. Turns out that when this happens the value passes validation but errors because of SQL Server's date boundary (01/01/1753).
So, what would be the simplest way to get validation to pick this up, rather than a nasty server error?
Man... if there's a 'hole' a client's gonna find it :/
Unfortunately it's been a while since I did this for our danish clients, in order to make sure the date format was in danish but it should be possible to overwrite the Contour defaults if you have a peek in the contour code.
The language/culture/format of the date picker is fine, and I know there's a 'YearRange' setting you can use in the jQuery UI date picker to limit the range of dates available to be picked, which would help a little, but not much, so I'm happy to leave the date-picker pop-up as it is.
The issue is when someone types the date into the input field (I need to allow them to type as well as using the jQuery UI picker as the potential range is huge). Everything works great, except that dates outside of SQL Server's range are accepted as valid by jQuery validation (and Contour's own server-side validation). Since the validation only checks the format, it's passing; it needs to check the range as well which isn't something it does by default nor even via it's own available methods.
My first thought was just to inject 'min' and 'max' attributes into the date fields via JavaScript, which should make HTML5 validation kick-in. It does, but unfortunately that conflicts with jQuery validation which assumes those values to be integers rather than dates (perhaps because they're text input fields rather than date input fields?). So that's a no-go. What I've done instead is to extend jQuery validate with some custom methods. So in my main site JavaScript file I now have the following:
// Extend jQuery validation with min date method
$.validator.addMethod('mindate', function (v, el, minDate) {
if (this.optional(el)) {
return true;
}
var curDate = $(el).datepicker('getDate');
return minDate <= curDate;
}, 'Please specify an appropriate date');
// Extend jQuery validation with max date method
$.validator.addMethod('maxdate', function (v, el, minDate) {
if (this.optional(el)) {
return true;
}
var curDate = $(el).datepicker('getDate');
return minDate >= curDate;
}, 'Please specify an appropriate date');
jQuery(document).ready(function () {
// Apply custom validation rules
var datePickerField = $('.datepickerfield');
if(datePickerField.length){
$('.datepickerfield').rules('add', {
mindate: new Date(1753, 1, 1), // Min SQL Server date range
maxdate: new Date(2079, 6, 6) // Max SQL Server smalldatetime range (full date time can go up to 9999)
});
}
});
I'm not going to be able to solve the server-side validation but client-side should be good enough for now. I'll raise a bug in the Contour issue tracker so hopefully the gap in the server-side validation can be plugged.
Javascript validation allows dates pre-1/1/1753 but Contour errors
Hi,
A fun one for a Friday morning. My client has a user who entered the following date, by accident, into a Contour form: '08/12/1013'. They meant '08/12/2013'. Turns out that when this happens the value passes validation but errors because of SQL Server's date boundary (01/01/1753).
So, what would be the simplest way to get validation to pick this up, rather than a nasty server error?
Man... if there's a 'hole' a client's gonna find it :/
Thanks
Hi Dan
Would it be possible to overwrite the default language settings for the datepicker using the formatdate method? http://api.jqueryui.com/datepicker/ more specifically here http://api.jqueryui.com/datepicker#utility-formatDate
Unfortunately it's been a while since I did this for our danish clients, in order to make sure the date format was in danish but it should be possible to overwrite the Contour defaults if you have a peek in the contour code.
Hope this gives you an idea.
/Jan
Thanks Jan.
The language/culture/format of the date picker is fine, and I know there's a 'YearRange' setting you can use in the jQuery UI date picker to limit the range of dates available to be picked, which would help a little, but not much, so I'm happy to leave the date-picker pop-up as it is.
The issue is when someone types the date into the input field (I need to allow them to type as well as using the jQuery UI picker as the potential range is huge). Everything works great, except that dates outside of SQL Server's range are accepted as valid by jQuery validation (and Contour's own server-side validation). Since the validation only checks the format, it's passing; it needs to check the range as well which isn't something it does by default nor even via it's own available methods.
My first thought was just to inject 'min' and 'max' attributes into the date fields via JavaScript, which should make HTML5 validation kick-in. It does, but unfortunately that conflicts with jQuery validation which assumes those values to be integers rather than dates (perhaps because they're text input fields rather than date input fields?). So that's a no-go. What I've done instead is to extend jQuery validate with some custom methods. So in my main site JavaScript file I now have the following:
I'm not going to be able to solve the server-side validation but client-side should be good enough for now. I'll raise a bug in the Contour issue tracker so hopefully the gap in the server-side validation can be plugged.
Bug report, in case anyone encounters this and/or would care to vote for it: http://issues.umbraco.org/issue/CON-608.
Comment author was deleted
Nice one, thanks for reporting we'll make sure that these don't cause a ysod, new maintenance release coming next week (v 3.0.22)
is working on a reply...