Friday, January 16, 2009

JQuery UI, ThemeRoller and transparent datepicker

Recently we had some issues with JQuery UI which didn't render the widgets correctly.

An example of a JQuery UI widget is the datepicker (screenshot), like you can see working on Apex Blogs

If you want to change the look and feel of the date picker (or any other widget) you can do that by creating a new theme on the ThemeRoller site or by selecting one of the gallery.

However while we did that our datepicker became transparent and it looked like it couldn't find the css or the background images anymore. As we already used it in more projects, we were sure our code was right.

Finally we found that a different version of the JQuery UI can get you into that situation. The fix then is to use the version you know your css works with or to download the latest version of JQuery UI and create the theme again from the site and use that instead.
at

4 comments:

  1. Louis-Guillaume1/17/2009 12:19 AM

    Dimitri,

    Thanks for the solution!

    I didn't have the time to try it with the new jQuery 1.3 version. Did you?

    ReplyDelete
  2. Dimitri Gielis1/19/2009 3:03 PM

    Hi Louis-Guillaume,

    Jquery UI and the themeroller works fine with jQuery 1.3 (during my tests).

    The only difficulties I had with JQuery 1.3 were that some plugins stopped working.

    Dimitri

    ReplyDelete
  3. Anonymous1/21/2009 11:55 AM

    Thanks for the great articles about Datepicker and ThemeRoller.

    If you want to use jQuery UI 1.5.3 you'll still have to use jQuery 1.2.6 and there's a link on ThemeRoller for downloading a 1.5 compatible theme.

    If you use 1.6rc5 it is compatible with 1.3 and will work with default themes downloaded from ThemeRoller.

    ReplyDelete
  4. Anonymous1/22/2009 3:09 PM

    Hi Dimitri,

    Just wondering how I go about including a new datepicker theme into my Apex app?

    Is there a doc that describes the steps?

    Thanks.
    Tony.

    ReplyDelete