我如何完全*删除jQuery UIdateselect器?
我有一个date文本字段,我只希望有时附加一个DatePicker,因为我有一些我自己的处理部分datestring的文本处理脚本。 调用.remove或.destroy会在input字段上留下文本格式的行为,然而,这会将我的“8”string转换为“8/18/2010”。 更糟糕的是,如果我开始删除,那就坚定地认为,一旦我达到“8/18/20”, 其实我想要“8/18/2020”。
什么是完全,完全,使它像它从来没有的最好的办法是从我的网页中删除dateselect器? 我也可以使用它,如果它只是忽略我始终input的文本,但在这种情况下,我更喜欢它出现在双击/图像的button,并不总是。
编辑:
这是所有在一个jqGrid,其中'select器'是一个date列上的文本框:
function showPicker(selector) { $(selector).datepicker({ onClose: function() { $(selector).datepicker('remove'); // or 'destroy' or $('.datepicker').remove(); or $(this).datepick('remove'); } }); }
这可以防止它回来,但不能操纵我的文本字段。 没有其他代码(我知道)正在操纵该字段的内容,只是jqGrid注意input密钥发送数据。 看着页面生成的代码,datepicker div甚至还在底部。
编辑2:我得到完全相同的行为,如果我这样做:
<html> <body> <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js"></script> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(document).ready( function(){ $("#pickle").datepicker({ onClose: function(){ $(this).datepicker('remove'); } }); }); </script> <input type="text" id="pickle" /> </body> </html>
这导致相同的行为,我所看到的,但将其改为“销毁” 在这里工作,但不是在我的网页上。 奇。
这完全删除.datepicker
:
$( selector ).datepicker( "destroy" ); $( selector ).removeClass("hasDatepicker").removeAttr('id');
文档:
http://docs.jquery.com/UI/Datepicker#method-destroy
也阅读下面的评论
我通过删除dateselect器类,然后调用绑定到dateselect器的元素的解除绑定方法来解决问题。 这似乎摆脱它!
例如:
$('#myelement').datepicker(); /////////datepicker attached to myelement//////
接着:
$('#myelement').removeClass('calendarclass'); $('#myelement').removeClass('hasDatepicker'); $('#myelement').unbind();
只要删除类仍然让input元素在点击时调用datepicker。可能unbind()
本身可以做的工作,但我是一种皮带和括号。
取决于你的情况,你可以做到服务器端
防爆。 在类似asp的sytax中
<% if( showDatePicker ) {%> $('#dp-div').DatePicker(); // or whatever <% } %>
编辑
如何设置datepicker的dateFormat ? 即
$( ".selector" ).datepicker({ dateFormat: 'yy-mm-dd' });
你可能想要
$( ".selector" ).datepicker({ dateFormat: '...' });
在单页面应用程序中,即使页面的内容发生变化,jquery ui仍然是垃圾。 所以我喜欢这个单页面应用程序。
(function($) { if ($.ui !== null && typeof $.ui !== typeof undefined) { /** * dialog fix */ var $oDialog = $.fn.dialog $.fn.dialog = function(mth, dialogOpts) { if (mth !== null && typeof mth === 'string') { if (mth === 'clean') { var id = $(this).attr('id'); // you must set id if (id !== null && typeof id !== typeof undefined) { // garbage jquery ui elements remove $('[aria-describedby="' + id + '"]', document).each(function() { if ($(this).dialog('instance')) { $(this).dialog('destroy'); } $(this).remove(); }); } return this; } else if (mth === 'open' && dialogOpts !== null && typeof dialogOpts === 'object') { if ($oDialog.apply(this, ['instance'])) { $oDialog.apply(this, ['option', dialogOpts]); return $oDialog.apply(this, ['open']); } else { return $oDialog.apply(this, dialogOpts); } } } return $oDialog.apply(this, arguments); }; } })(jQuery);
在页面脚本中使用像这样
// target layer in my page var $xlsDiv = $('#xlsUpFormDiv'); $xlsDiv.dialog('clean'); // clean garbage dialog var dialogOpts = { autoOpen: false, closeOnEscape: true, height: 800, width: 600, modal: true, buttons: ..., close: function() { $xlsForm.reset(); } }; // initialize original jquery ui $xlsDiv.dialog(dialogOpts); // open button click $('#btnViewXlsUpForm').on("click", function() { $xlsDiv.dialog('open', dialogOpts); });