Question

我用一些输入字段（每行）编写一个jQuery数据表。其中一个字段需要是一个日期，因此我尝试使用jQuery datepicker来完成该字段的输入。

使用模板为每一行呈现相关字段：

var invoiceDateInputTemplate = '<input class="datepicker" id="InvoiceDate_{0}" name="InvoiceDate_{0}" type="text" />';

在数据表构建期间，我渲染模板并用适当的Id替换{0}，以便id＆amp;名称参数对于每一行都是唯一的。

在我的$（document）.ready（）函数的最后，在构建表之后，我运行以下代码来生成我的每一个日期＆＃39;使用类选择选项将字段转换为启用了datepicker的字段。出于某种原因，这似乎并不希望导致字段变为启用了datepicker：

$(function() {
    $(".datepicker").datepicker();
});

如果我在$（＆＃34; .datepicker＆＃34;）。datepicker（）之前添加一个alert（）调用，它就像一个champ ...在datepicker初始化之后调用一个alert（）调用工作

这会导致DatePicker呈现：

$(function() {
    alert();
    $(".datepicker").datepicker();
});

这会导致DatePicker无法呈现（包含以提供示例）：

$(function() {
    $(".datepicker").datepicker();
    alert();
});

为什么会这样？我是否遗漏了导致DatePicker未按预期初始化字段的内容？我非常确定必须触发警报才能让DatePicker正常工作，这不是标准操作程序。另外，为了澄清，我不相信在数据表构建之后我有任何关注的领域。

Answer 1

我觉得你有一个异步问题！

最简单的解决方案是在自定义事件上绑定对datepicker()的调用，然后在构建数据表后触发事件。像这样：

$(function() {
    // Create data table here
    $(window).trigger('datatable.built');
});

$(window).on('datatable.built', function() {
    $(".datepicker").datepicker();
});

Answer 2

试试这个：

$(function() {
    $(document).on("focusin",".datepicker",function(){
        $(this).datepicker();
    });
});

如果它有效，你可以改进，而不是'＃34;重新创建＆＃34;每当元素获得焦点时，datepicker

Answer 3

事实证明，@ Guy有解决方案......我在setTimeout中设置了该功能，它开始按原样运行：

setTimeout(function() {
        $(".datepicker").datepicker();
    },1000);

我之前应该想到这一点......谢谢@Guy！

Answer 4

你在使用datatable有什么用？最有可能是在你附加事件后渲染，在这种情况下，它应该有一个像draw或者其他事件表明数据被渲染的事件

只有在脚本

4 个答案: