Use a jQuery UI datePicker widget in your CFWheels forms
datePicker and datePickerTag functions accept the same arguments as CFWheels textField and textFieldTag functions respectively, but they also accept all options for the jQuery datePicker widget
Following the road to DatePicker Glory
1. Install the DatePicker plugin from CFWheels or GitHub
2. Make sure you have setup jQuery AND jQuery UI in your app (consider my JQuack plugin)
3. Use the datePicker()
and datePickerTag()
form helpers
Examples
<!--- Use with objects ---> #datePicker(label="Birthday", objectName="user", property="birthday")# <!--- Use without objects ---> #datePickerTag(label="Birthday", name="birthday", value=Now())#
Note: All jQuery specific arguments (jQuery datePicker options) are case-sensitive
Hi. Thanks for the plugin but I wonder if you could be a bit more specific about setting up jquery and jqueryui. I’ve put them in the javascripts file and nothing is complaining that it can’t find them but the datepicker is behaving exactly like a text field. I did have it sort of working once but it completely lacked styling, from which I concluded I was supposed to put the jquery ui css stuff somewhere, but I have no idea where. And now it doesn’t work at all. TIA.
Hi Joe, Maybe have a look at my JQuack plugin.. this should give you some guidelines on setting up your jQuery and UI packages.. It’s what I use. Thanks for commenting!
It was all about getting the themes in. Right now I have it working by putting
in my layout.cfm. Not perfect maybe but it works.
I did look at JQuack and frankly it looked too complicated. I was looking for something very simple, ie, where the heck do I put these files?
Glad you have it working. JQuack is actually very simple.. maybe I have provided too many examples. All you need to do is put your jQuery and UI files where I have suggested, click the plugin link in the cfwheels debug, follow the instructions (usually just the Save button) then call #JQuack(“all”)# function in your layout file.
All the best!