datatables warning (table id = '') expression expected

Question

第一次尝试让这个日期范围选择器在我的数据表中工作，但出现上述错误。谁能帮我弄清楚我在这里遗漏了什么。

下面添加的是我视图中的脚本 -

<script type="text/javascript" src="~/Content/metronic/assets/global/plugins/bootstrap-confirmation/bootstrap-confirmation.min.js"></script>
<script type="text/javascript" src="~/Content/metronic/assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
<script type="text/javascript" src="~/Content/metronic/assets/global/plugins/datatables/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="~/Content/metronic/assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js"></script>
<script type="text/javascript" src="~/Content/Js/yadcfDatatableColumnFilter/jquery.dataTables.yadcf.js"></script>

<script>


    completeWrDtbLoad();

    /*** COMPLETE WR DTB ***/
    function completeWrDtbLoad() {

        var status = [2];
        var dtbCol = [
            //{
            //      'data': null, 'render': function (data, type, full, meta) {
            //          return '<span class="row-details row-details-close"></span>';
            //      }
            //},
              { 'data': 'smsPhone', 'name': 'smsPhone', 'type': 'string' },
              { 'data': 'smsName', 'name': 'smsName', 'type': 'string' },
            { 'data': 'smsContent', 'name': 'smsContent', 'type': 'string' },
            {
                'data': 'smsDate', 'name': 'smsDate', 'type': 'daterange', 'render': function (data, type, full, meta) {
                    var res = ToJavaScriptDate(data);
                    return res;
                },
            },
            { 'data': 'smsDescription', 'name': 'smsDescription', 'type': 'string' },
            { 'data': 'smsStatus', 'name': 'smsStatus', 'type': 'string' },
            {
                'data': null, 'name': '', 'render': function (data, type, full, meta) {
                    return ''
                }
            }

        ];

        $('#tb-completeWr2').dataTable({
            'serverSide': true,
            'ajax': {
                'type': 'POST',
                'url': '@Url.Action("getSmsHistory", "SMS")',
                'contentType': 'application/json; charset=utf-8',
                'data': function (data) {
                    for (i = 0; i < dtbCol.length; i++) {
                        data.columns[i].type = dtbCol[i].type;
                        //data.orderType = orderType;
                        //data.orderStatus = orderStatus;
                    }

                    return data = JSON.stringify(data);
                },
            },
            "dom": "<'row' <'col-md-12'T>><'row'<'col-md-6 col-sm-12'l>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",
            'pageLength': 50,
            'processing': true,
            'paging': true,
            'columns': dtbCol,
            'order': [3, 'desc']
        }).yadcf([
            { column_number: 0, filter_type: 'text', style_class: "", filter_default_label: 'Search', filter_container_id: "column0" },
            {
                column_number: 3, filter_type: 'range_date', style_class: "", filter_container_id: "column3", date_format: 'dd/mm/yyyy', datepicker_type: 'bootstrap-datepicker',
                filter_plugin_options: {
                    autoclose: true,
                }
            },
        ]);

    }
</script>

Answer 1

您需要使用这个日期选择器插件Bootstrap 3 Datepicker