3 Replies Latest reply on Jun 14, 2010 4:52 PM by Ben Vanberg

    rich:calendar issue with jquery ui dialog

    Ben Vanberg Newbie

      I am having an issue with rich:calendar when used inside a jquery dialog. rich:calendar is working fine for me outside of a dialog, but as soon as I place it in the dialog the calendar does not show when clicking the calendar icon.

       

      Upon debugging I found that the calendar does show, but is immediately hidden again so it appears that the calendar does not show at all. What is happening is the javascript method doSwitch() in calendar.js is being called twice. Since this is a toggle it does what it is supposed to on the first call (show the calendar) and then does what it is supposed to on the second call (hide the calendar). doSwitch() is called via a javascript event wrapper (mouse event on the calendar icon) which is an anonymous javascript function. I have verified that the doSwitch() is only called once in the working version which is not in the jquery dialog.

       

      Any ideas why this event gets wrapped twice when in a dialog?

       

      Thanks,

       

      Ben.

        • 1. Re: rich:calendar issue with jquery ui dialog
          Ben Vanberg Newbie

          Turns out that the 2nd event is getting wired up when jquery creates the dialog. So this is likely a jquery issue. However, if anyone has any ideas for fixing this one please let me know.

          • 2. Re: rich:calendar issue with jquery ui dialog
            Nick Belaevski Master

            Hi,

             

            I've observed similar problems when effects were activated in jQuery.UI: http://dev.jqueryui.com/ticket/4839.

            1 of 1 people found this helpful
            • 3. Re: rich:calendar issue with jquery ui dialog
              Ben Vanberg Newbie

              Yes, I am seeing the same behavior you've described with effects when using jQuery's UI Dialog. Even without effects on the dialog I get the 2nd call to new Calendar(...), and thus multiple event wrappers created for each rich:calendar icon.

               

              I've solved this issue for the time being with a small hack. Using jQuery I remove the javascript for the calendar component before I create the jQuery dialog. This appears to work and thus far doesn't have any negative effects on the functionality of the rich calendar. As I'm removing in the jQuery on page ready method the rich:calendar javascript has already been called.

               

                          // Before we create the dialog remove the javascript for the rich:calendar control. Avoids duplicate Calendar
                          // objects and duplicate events which break the calendar.
                          $j('[id$=DateScript]').remove();
              
              1 of 1 people found this helpful