PDA

View Full Version : How do I set the background of a day in the datepicker?



Elijah
10 Jun 2010, 10:40 AM
I need to use the datepicker with color coded days to reflect information is present for that day. Can someone point me to an example anywhere so I can see how to do this?

I need to I am assuming to properly display the datePicker I must
1. Have my data from an AJAX with information on days that have information.
2. Prior to rendering of the datePicker tell it what days to shade in a different color

#1 I have its #2 that I don't know what to do yet.:-?
How do I tell the datePicker to highlight lets say days of the month 5, 6, 13?
How do I tell it to make those days have a background color of blue?
Can I disable clicking on the other days that I do not have a background color on?

Elijah
12 Jun 2010, 7:40 PM
still trying to get this working.

Elijah
14 Jun 2010, 8:20 AM
anyone?

Elijah
24 Jun 2010, 6:09 AM
anyone?

Animal
24 Jun 2010, 6:39 AM
Have you been in suspended animation? What steps have you taken to TRY to work this?

I'd play with DomQuery on the Firebug command line for a minute or so...



Ext.get("my-datepicker-id").child("td.x-date-active:contains(5)").dom


Gets the 5th.

Animal
24 Jun 2010, 6:41 AM
But http://www.sencha.com/deploy/dev/docs/?class=Ext.DatePicker&member=disabledDates

And http://www.sencha.com/deploy/dev/docs/?class=Ext.DatePicker&member=disabledDays

And that sets a class, and you can write CSS.

jlawton
26 Oct 2012, 10:00 AM
It actually gets the 5th, 15th, and 25th. But you're pointing in the right direction. Thanks!

jlawton
26 Oct 2012, 12:14 PM
I got it to work with code like this. It's messy, but it'll do for now.



Ext.get(Ext.get('mydatepicker').query('td.x-datepicker-active[title*="15,"]')[0].id).addCls("mynewclass")

wm003
4 Jan 2013, 1:38 PM
Try DatePickerPlus (http://extjs.com/forum/showthread.php?p=148587). It has support for custom css on any days you like.

jlawton
7 Jan 2013, 7:24 AM
DatePickerPlus is overkill, and I don't want too many 3rd party things in my codebase. I got it to work, I should post what I did here so others might find it useful.