Datepicker: show inline datepicker setting explicit display:block ins…

…tead of using .show() in case it is disconnected. Fixed #7552 - A Datepicker created on a detached div has zero height (cherry picked from commit b8af0d1)
jquery · Jul 19, 2011 · c81bfb9 · c81bfb9
1 parent ab3b78e
commit c81bfb9
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 1 deletion.
diff --git a/tests/visual/datepicker/datepicker_ticket_7552.html b/tests/visual/datepicker/datepicker_ticket_7552.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8" />
+	<title>Datepicker Visual Test : Datepicker ticket #7552</title>
+	<link rel="stylesheet" href="../visual.css" type="text/css" />
+	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
+	<script type="text/javascript" src="../../../jquery-1.5.1.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
+	<script type="text/javascript">
+	$(function() {
+		$('<div></div>').datepicker().appendTo("body");
+	});
+	</script>
+</head>
+<body>
+
+<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/7552">#7552 - A Datepicker created on a detached div has zero height</a></h1>
+
+</body>
+</html>
diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js
@@ -285,7 +285,9 @@ $.extend(Datepicker.prototype, {
 		if( inst.settings.disabled ) {
 			this._disableDatepicker( target );
 		}
-		inst.dpDiv.show();
+		// Set display:block in place of inst.dpDiv.show() which won't work on disconnected elements
+		// http://bugs.jqueryui.com/ticket/7552 - A Datepicker created on a detached div has zero height
+		inst.dpDiv.css( "display", "block" );
 	},
 
 	/* Pop-up the date picker in a "dialog" box.