Question

以下是我的bootstrap数据表脚本。脚本有三个功能的三个部分。 Daterange选取器和数据表以及清除过滤器。我的问题是，当daterange选择器和清除过滤器脚本工作时，Datatable不会运行。当两者都被评论时，数据表工作正常。

<script>
    //daterange picker and filter both
    var oTable;
    $(document).ready(function () {
        'use strict';
        var datepickerDefaults = {
            showTodayButton: true,
            showClear: true
        };
        $('#example').dataTable().yadcf([
            {column_number: 12, filter_type: "range_date", datepicker_type: 'bootstrap-datetimepicker', date_format: 'DD-MMM-YY', filter_plugin_options: datepickerDefaults}
        ]);
        SyntaxHighlighter.all();
    });

    //datatable 
    $(document).ready(function () {
        $('#example').DataTable({
            dom: 'Bfrtip',
            buttons: ['excel'],
            lengthChange: true,
            paging: false,
            scrollY: 535,
            scrollX: false,
            sScrollXInner: "190%",
            "oLanguage": {"sSearch": "Search"},
            "columnDefs": [
                {"sClass": "datecol", "aTargets": [12]},
                {"orderable": false, "aTargets": [13]},
                {"orderable": false, "aTargets": [14]},
                {"orderable": false, "aTargets": [15]},
            ],
            "order": [[12, "desc"]],
            initComplete: function () {
                this.api().columns().every(function (currentValue) {
                    if (currentValue !== 15 & currentValue !== 14 & currentValue !== 13) {
                        var column = this;
                        var select = $('<select><option value=""></option></select>')
                                .css('width', 60)
                                .appendTo($(column.footer()).empty())
                                .on('change', function () {
                                    var val = $.fn.dataTable.util.escapeRegex(
                                            $(this).val()
                                            );
                                    column
                                            .search(val ? '^' + val + '$' : '', true, false)
                                            .draw();
                                });
                        column.data().unique().sort().each(function (d, j) {
                            select.append('<option value="' + d + '">' + d + '</option>')
                        });
                    }
                });
            }
        });
    });

    // Clear filtered data
    $.extend($.fn.dataTable.defaults, {
        fnInitComplete: function (oSettings, json) {
            // Add "Clear Filter" button to Filter
            var btnClear = $('<button class="btnClearDataTableFilter">clear</button>');
            btnClear.appendTo($('#' + oSettings.sTableId).parents('.dataTables_wrapper').find('.dataTables_filter'));
            $('#' + oSettings.sTableId + '_wrapper .btnClearDataTableFilter').click(function () {
                $('#' + oSettings.sTableId).dataTable().fnFilter('');
            });
        }
    });
</script>

数据表脚本不起作用

0 个答案: