javascript - 日期选择器不显示日期 - Bootstrap

Question

我正在努力寻找这个问题的答案，我之所以苦苦挣扎是因为日期选择器正在我的一个页面上工作。

问题可能是我在与日期选择器同时加载数据表吗？因为在损坏的页面上，我正在加载使用日期选择器中的日期的数据表。

问题已重现

JSFiddle - 不包含 FilterLoggingTable 函数，它可以正常工作。

日期选择器的代码片段

if (typeof $('#generateDate, #loggingDatePicker').datepicker !== 'undefined')
{
    var currentDate = new Date();
    $('#generateDate, #loggingDatePicker').datepicker(
    {
        format: 'dd-mm-yyyy',
        autoclose: false
    });
    $('#generateDate, #loggingDatePicker').datepicker('setValue', currentDate).datepicker('update').datepicker();

}

HTML(损坏的日期选择器)

<div class="col-sm-6">
    <div class="input-group date col-md-3 pull-right" data-date-format="dd-mm-yyyy" data-date="12-04-2015">                        
    <input id="loggingDatePicker" class="form-control" type="text" value="12-04-2015" size="14" />
       <span class="input-group-addon add-on">
          <span class="glyphicon glyphicon-calendar"></span>
       </span>
    </div>
</div>

HTML(工作日期选择器)

<div class="col-md-4 form-group">
   <div class="input-group date " data-date-format="dd-mm-yyyy" data-date="12-04-2015">                        
   <input id="generateDate" class="form-control generatePDFBTNS" type="text" value="12-04-2015" size="14" />
     <span class="input-group-addon add-on">
         <span class="glyphicon glyphicon-calendar"></span>
     </span>
   </div>
</div>

页面损坏

工作页面

Answer 1

<强> DEMO

好的。问题在于您的以下行:

("tr:not(:has(>th))").show().filter

FilterLoggingTable() 函数内部。

What this does is hides or shows all the trs in the page when criteria is matched!Now why this effects your calendar is because the bootstrap creates table for your calendar when you initialize the datepicker and that table will also match the above criteria which should be only there for dataTables.

因此，您需要做的就是获取 dataTable 的 tr，如下所示:

$('#dataTables-example').find("tr:not(:has(>th))").show().filter(function ()

现在，如果您愿意，您可以保留 autoclose:false ..