diff options
Diffstat (limited to 'demos/datepicker/icon-trigger.html')
| -rw-r--r-- | demos/datepicker/icon-trigger.html | 28 |
1 files changed, 21 insertions, 7 deletions
diff --git a/demos/datepicker/icon-trigger.html b/demos/datepicker/icon-trigger.html index 71d0621d4..ef3362a11 100644 --- a/demos/datepicker/icon-trigger.html +++ b/demos/datepicker/icon-trigger.html @@ -8,12 +8,26 @@ <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> <script src="../bootstrap.js"> - $( "#datepicker" ).datepicker({ - showOn: "button", - buttonImage: "images/calendar.gif", - buttonImageOnly: true, - buttonText: "Select date" - }); + var allowOpen = false, + datepicker = $( "#datepicker" ).datepicker({ + beforeOpen: function() { + return allowOpen; + }, + open: function() { + allowOpen = false; + } + } ), + widget = datepicker.datepicker( "widget" ); + + $( "<button>" ) + .append( "<img src='images/calendar.gif' alt='Open Datepicker'>" ) + .insertAfter( datepicker ) + .on( "click", function() { + allowOpen = true; + if ( widget.is( ":hidden" ) ) { + datepicker.focus(); + } + }); </script> </head> <body> @@ -21,7 +35,7 @@ <p>Date: <input type="text" id="datepicker"></p> <div class="demo-description"> -<p>Click the icon next to the input field to show the datepicker. Set the datepicker to open on focus (default behavior), on icon click, or both.</p> +<p>Click the icon next to the input field to show the datepicker. This demo will be removed soon since its promoting bad practice. Please see our migration guide.</p> </div> </body> </html> |