Question

我有一个日期文本字段我希望只有有时附加一个DatePicker，因为我有一些自己的文本处理脚本来处理部分日期字符串。但是，调用.remove或.destroy会在输入字段上保留文本格式化行为，这会将我的“8”字符串转换为“8/18/2010”。更糟糕的是，如果我开始删除，它会坚定地认为，一旦我达到“8/18/20”，我实际上想要“8/18/2020”。

什么是最好的方式完全，完全，让它像从未删除我的页面中的日期选择器？我也可以使用它，如果它只是忽略我在任何时候完全输入的文本，但在这种情况下我更喜欢它出现在双击/图像按钮上，而不是总是。

编辑：

这都在jqGrid中，其中'selector'是日期列上的文本框：

function showPicker(selector) {
    $(selector).datepicker({
        onClose: function() {
            $(selector).datepicker('remove'); 
            // or 'destroy' or $('.datepicker').remove(); or $(this).datepick('remove');
        }
    });
}

这可以防止它返回，但不能操纵我的文本字段。没有其他代码（我知道）正在操纵该字段的内容，只是jqGrid正在监视输入密钥以发送数据。查看页面生成的代码，datepicker div甚至仍位于底部。

edit2：如果我这样做，我会得到完全相同的行为：

<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>

这会导致与我所看到的相同的行为，但将其更改为“destroy”在这里但在我的页面上不起作用。奇

Answer 1

这将完全删除.datepicker：

$( selector ).datepicker( "destroy" );
$( selector ).removeClass("hasDatepicker").removeAttr('id');

文档：
http://docs.jquery.com/UI/Datepicker#method-destroy
还阅读以下评论

Answer 2

我通过删除datepicker类然后在绑定到datepicker的元素上调用unbind方法来解决问题。这似乎摆脱了它！

例如：

$('#myelement').datepicker();

/////////datepicker attached to myelement//////

然后：

$('#myelement').removeClass('calendarclass');
$('#myelement').removeClass('hasDatepicker');
$('#myelement').unbind();

只是删除类仍然让输入元素在单击时调用datepicker。可能unbind()本身就可以完成这项工作，但我有点像带子。

Answer 3

根据您的情况，您可以在服务器端执行

asp-like sytax中的

Ex。

<% if( showDatePicker ) {%>
    $('#dp-div').DatePicker(); // or whatever
<% } %>

修改
如何设置日期选择器的dateFormat？即

$( ".selector" ).datepicker({ dateFormat: 'yy-mm-dd' });
你可能想要

$( ".selector" ).datepicker({ dateFormat: '...' });

Answer 4

在单页面应用中，即使页面内容发生变化，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);
});

我如何完全删除jQuery UI datepicker？

4 个答案:

我如何*完全*删除jQuery UI datepicker？

4 个答案:

我如何完全删除jQuery UI datepicker？