SOLVED. God that is a relief! Thanks for the helpful responses, I couldn't have done it without your help.
I finally discovered that the official JavaScript documentation is on the mozilla website and read up about the date function and discovered it can convert strings to dates too. https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference For anyone that is interested here is my code... [ XHTML ] <li> <label for="txtDateFrom">Date From<br /><sup>(dd/mm/yyyy)</sup></ label> <input type="text" id="txtDateFrom" name="txtDateFrom" value="12/06/2009" tabindex="4" /> <input type="hidden" id="jsDateFrom" name="jsDateFrom" value="Fri, Jun 12 2009 09:00:00 GMT" /> </li> <li> <label for="txtDateTo">Date To<br /><sup>(dd/mm/yyyy)</sup></label> <input type="text" id="txtDateTo" name="txtDateTo" value="17/12/2009" tabindex="5" /> <input type="hidden" id="jsDateTo" name="jsDateTo" value="Thu, Dec 17 2009 09:00:00 GMT" /> </li> [ JS ] $(document).ready ( function() { $('#txtDateFrom').datepicker ( { buttonImage: '/img/icons/silk/calendar.png', buttonImageOnly: true, changeMonth: false, changeYear: false, constrainInput: false, dateFormat: 'dd/mm/yy', duration: '', onSelect: function(dateText, inst) { $('#txtDateTo').datepicker('option', 'minDate', new Date (inst.selectedYear, inst.selectedMonth, inst.selectedDay)); }, showOn: 'both' } ); $('#txtDateTo').datepicker ( { buttonImage: '/img/icons/silk/calendar.png', buttonImageOnly: true, changeMonth: false, changeYear: false, constrainInput: false, dateFormat: 'dd/mm/yy', duration: '', onSelect: function(dateText, inst) { $('#txtDateFrom').datepicker('option', 'maxDate', new Date (inst.selectedYear, inst.selectedMonth, inst.selectedDay)); }, showOn: 'both' } ); $('#txtDateTo, #txtDateFrom').datepicker('option', 'minDate', new Date($('#jsDateFrom').val())); $('#txtDateTo, #txtDateFrom').datepicker('option', 'maxDate', new Date($('#jsDateTo').val())); } ); Thanks again. Feel free to use this as an example in the documentation. On Jun 10, 11:22 am, Luke <[email protected]> wrote: > Can't get this to work either... > > $(document).ready > ( > function() > { > $('#txtDateTo, #txtDateFrom').datepicker('option', 'minDate', > $ > ('#jsDateFrom').val()); > $('#txtDateTo, #txtDateFrom').datepicker('option', 'maxDate', > $ > ('#jsDateTo').val()); > } > ) > > Is what I want to do even possible? > > On Jun 10, 11:11 am, Luke <[email protected]> wrote: > > > The documentation in general is lacking. How on earth am I expected to > > create this code (kindly provided by Ca-Phun Ung): > > $(function(){ > > $('#dateFrom').datepicker({ > > dateFormat: 'dd/mm/yy', > > onSelect: function(dateText, inst) { > > console.log(inst); > > $('#dateTo').datepicker('option','minDate', new > > Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay)); > > } > > }); > > $('#dateTo').datepicker({ > > dateFormat: 'dd/mm/yy', > > onSelect: function(dateText, inst) { > > $('#dateFrom').datepicker('option','maxDate', new > > Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay)); > > } > > }); > > > }); > > > From this information in the documentation? > > > > onSelect function(dateText, inst) > > > > Allows you to define your own event when the datepicker is selected. > > > The function receives the selected date as text and the datepicker > > > instance as parameters. this refers to the associated input field. > > > Code examples > > > > Supply a callback function to handle the onSelect event as an init option. > > > > $('.selector').datepicker({ > > > onSelect: function(dateText, inst) { ... } > > > }); > > > No examples, no explanation what "dateText" or "inst" are, no clues as > > to what you can do with them. Might as well not have bothered writing > > anything at all, because what is there does not help the reader > > understand what this event does. > > > JavaScript to me is voodoo, it is very strict/fussy, and is very > > difficult if not impossible to debug, then there's loads of fun to be > > had with cross browser testing. I have Firebug installed on Firefox, > > but it doesn't seem to do anything, not sure if the Linux version has > > less features - but it doesn't do anymore more than the error console > > does, and even then that can give you a red herring and won't throw > > errors if your code is valid but not working as intended. The only way > > I have worked out how to debug things is to use alert(variable), and > > being told something is an object really doesn't help. > > > Is there an official JavaScript manual anywhere because I am sick of > > all this trial and error. I spent an entire afternoon on this date > > picker yesterday, and I'm STILL working on it now - how the hell am I > > supposed to justify that? How was I supposed to plan for it? It looks > > simple so people assume it should be simple, but this datePicker makes > > life too difficult. > > > Sorry for this rant but I am so frustrated with this now, everything > > that I try, that would work in any other language, doesn't seem to for > > JavaScript. I'm really struggling to get the datePicker to work with > > its own values. I even went to the effort of coding up a hidden field > > to hold the value of the default value of "txtDateTo" in the native > > JavaScript format. For instance, why the hell doesn't this work? > > > <input type="text" id="txtDateTo" name="txtDateTo" value="17/12/2009" > > tabindex="5" /> > > <input type="hidden" id="jsDateTo" name="jsDateTo" value="Thu Dec 17 > > 2009 09:00:00 GMT+0000 (GMT)" /> > > > var jsDateTo = $('#jsDateTo').val(); > > > $('#txtDateTo').datepicker > > ( > > { > > maxDate: jsDateTo > > } > > ) > > > All I want to do is make sure the user can't pick a date that is > > before the default date from, or after the default date to. This is > > driving me insane. > > > On Jun 10, 9:18 am, Steven Yang <[email protected]> wrote: > > > > Hi just want to second that I dont really like the format provided by > > > jQuery > > > as well maybe the php format will be great > > > > but after all jQuery as done a great job > > > > for the date restricting thing I have a sample which was actually provided > > > by jQuery ui in the old 1.6 sample code (not sure why the sample was > > > removed > > > for later versions) > > > > $("#from,#to").biDatepicker({ > > > beforeShow : function(input) { > > > return { > > > 'minDate' : (input.id == #to? > > > $('#from').datepicker('getDate') : null), > > > 'maxDate' : (input.id == #from ? > > > $('#to').datepicker('getDate') : null) > > > }; > > > } > > > }) --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
