jQuery Forum

Calling .datepicker('destroy') will create a new div, even if there was never a datepicker before.

1. <div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>

I have read here (datepicker("destroy") leftovers) that this is a shared div between the datepickers.

In some circumstances (I don't know when, but I see it in my application) this div becomes visible and I you move the mouse over it JQuery will throw this exception.

Benutzer-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.3; .NET4.0E)
Zeitstempel: Thu, 22 Nov 2012 13:31:50 UTC


Meldung: 'instActive.inline' ist Null oder kein Objekt
Zeile: 10095
Zeichen: 4
Code: 0
URI: http://localhost:49744/Scripts/jqueryMain/jquery-ui-1.8.23.js
 

This error occurs in Firefox, too.

Edit: If I open a datepicker, the div goes away and stays closed after closing the datepicker.

Thank you for your help,
MaKraus

Hello,

If a page contains an element, with id=main, qunit will break with javascript error.

1. Fehler: li is null
   Quelldatei: http://localhost:1516/Scripts/qunit.js
   Zeile: 189
   

because qunit.js uses an element with this id internally.
I think, less generic ids should be used.

For example asp.net mvc contains such an element in its default template.

1.         <div id="main">
               <asp:ContentPlaceHolder ID="MainContent" runat="server" />
   
               <div id="footer">
               </div>
   

Qunit version: jquery-qunit-2b3e049.zip

Greetings,
MaKraus

Hello,

If a dialog is opened and destroyed the div used as dialogcontent will be removed from its original position and will be appended to the body. This becomes a problem when using partial page updates, because the div will move out of the scope of the update. If the update creates the div again it will exist twice now, including all the problems like not unique IDs.

I have got two ideas to fix this.

Alternative 1: Memorize the parent element
Add following line to the _create function

1.     this.parentElement = this.element.context.parentNode;

In open function it can be used like this

1.     uiDialog.appendTo(this.parentElement);

And in the destroy function

1.     .hide().appendTo(this.parentElement);

Alternative 2: Set the target element as option
A new option could look like

1.     parentElement: 'body'

In open function it can be used like this

1.     uiDialog.appendTo(self.options.parentElement);

And in the destroy function

1.     .hide().appendTo(self.options.parentElement);

<edit>
For a dialog, that is not autoopening an additional code modification is needed

In _create function:

1.             uiDialog = (self.uiDialog = $('<div></div>'))
2.                 .appendTo(this.parentElement)

</edit>

Tested with JQuery UI Version 1.8.1

Greetings,
MaKraus