DataTables在页面的初始加载中设置列的默认值

时间:2016-02-12 09:22:51

标签: jquery datatables

我遇到了dataTables的问题。 如何在初始加载页面时在过滤器中指定默认值。

我发现此链接http://live.datatables.net/waselab/59/edit最初通过使用dataTable中的{ sSearch: 'London' }指定默认searchCols来过滤表格。 https://datatables.net/reference/option/searchCols这是我真正需要输出的内容,但似乎在我自己的例子中不起作用。

但是当我自己尝试时,它不会生效。还有其他办法吗?

这是我到目前为止所尝试的... 这是我的datatables.js

    $('#movie_table').DataTable({
        searchCols: [
            { sSearch: 'open' },
            null,
            null,
            null,                
            null,
            null,
            null,
            null,
            null
          ],
        "aoColumnDefs": [
            { "bSortable": false, "aTargets": [ 0, 2 ] },
        ],
        "order": [[ 1, "asc" ]],
        "lengthMenu": [[10, 20, 30, 40, 50, 100], [10, 20, 30, 40, 50, 100]],
        "iDisplayLength": 50,
    });

我的HTML部分:

<div class="container-fluid">
        <table id="dtv_movie_table" class="table table-striped table-bordered dataTable display">
            <thead style=" height: 30px; background-color:#F5F5F5; font-size:14px;">
                <tr>
                    <th class="text-center"><?php echo Yii::t('app', 'Delivery Status'); ?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Registered Date');?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Last Modified');?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'File Acquisition Date And Time');?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Title')?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Create Situation'); ?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Action'); ?></th>
                    <th class="text-center"><?php echo Yii::t('app', 'Last Modified'); ?></th>
                    <th class="text-center" style="display:none;"> </th>
                </tr>
            </thead>
            <tbody style="font-size:12px; height: 30px;">             
                <?php foreach($dtvMovie as $key => $val){?>
                <tr>
                    <td><!-- DELIVERY STATUS--->
                        <?php
                            foreach($dtvArticle as $key2 => $val2) {
                                if (($val2['grp_cd'] == 01) && $val2['cd'] == $val['article_status']) {
                                    echo $val2['data1'];
                                }
                            }
                        ?>
                    </td>
                    <td><!-- REGISTERED DATE--->
                        <?php
                            $publish_date_from = mb_substr(strip_tags($val['publish_date_from']), 0, 60, 'UTF-8');
                            echo (mb_strlen($publish_date_from) >= 60 && mb_strlen($val['publish_date_from'], 'UTF-8') > 60) ? $publish_date_from . '...' : $publish_date_from;
                        ?>
                    </td>
                    <td><!-- LAST MODIFIED--->
                        <?php
                            $cx_update_date = mb_substr(strip_tags($val['cx_update_date']), 0, 60, 'UTF-8');
                            echo (mb_strlen($cx_update_date) >= 60 && mb_strlen($val['cx_update_date'], 'UTF-8') > 60) ? $cx_update_date . '...' : $cx_update_date;
                        ?>
                    </td>
                    <td><!-- FILE ACQUISITION DATE AND TIME--->
                        <?php
                            $import_date = mb_substr(strip_tags($val['import_date']), 0, 60, 'UTF-8');
                            echo (mb_strlen($import_date) >= 60 && mb_strlen($val['import_date'], 'UTF-8') > 60) ? $import_date . '...' : $import_date;
                        ?>
                    </td>
                    <td><!-- TITLE--->
                        <?php
                            $title = mb_substr(strip_tags($val['title']), 0, 60, 'UTF-8');
                            echo (mb_strlen($title) >= 60 && mb_strlen($val['title'], 'UTF-8') > 60) ? $title . '...' : $title;
                        ?>
                    </td>
                    <td><!-- ZAPPING CREATE SITUATION--->
                        <?php
                            foreach($dtvArticle as $key2 => $val2) {
                                if (($val2['grp_cd'] == 02) && $val2['cd'] == $val['zapping_status']) {
                                    echo $val2['data1'];
                                }
                            }
                        ?>
                    </td>
                    <td><!-- ACTION--->
                        <a href="<?php echo Yii::$app->request->baseUrl.'/dtv/editor/edit/' . $val['article_id']; ?>" class="btn btn-edit-dtv">
                              <?php echo Yii::t('app', 'Edit Movie'); ?>
                          </a>
                    </td>
                    <td><!-- LAST MODIFIED--->
                        <?php
                            $up_time = mb_substr(strip_tags($val['up_time']), 0, 60, 'UTF-8');
                            echo (mb_strlen($up_time) >= 60 && mb_strlen($val['up_time'], 'UTF-8') > 60) ? $up_time . '...' : $up_time;
                        ?>
                    </td>
                    <td style="display:none;">
                        <!--- HIDDEN DIV for CATEGORY CODE ---->
                        <?php
                            foreach($dtvArticle as $key2 => $val2) {
                                if (($val2['grp_cd'] == 04) && $val2['cd'] == $val['news_cat_cd']) {
                                    echo $val2['data1'];
                                }
                            }
                        ?>
                    </td>

                </tr>
                <?php }?>
            </tbody>
        </table>
    </div>

这是在我的HTML

中呈现的表格

enter image description here

我做了searchCols:部分。但它什么都不做。请帮忙。

1 个答案:

答案 0 :(得分:1)

您的数据表代码没有问题,问题是您的表格HTML。在您发布该链接之前,任何人都无法帮助您,这突出了尽可能多地提供信息的重要性。

查看您的表格结构 - 整个表格内容在<thead>内,根本没有<tbody>部分!我很惊讶数据表设法渲染任何东西。

确保关闭thead部分&amp;正确启动tbody部分:

<thead>
    <tr>
      <th>Name</th>
      <th>Position</th>
      <th>Office</th>
      <th>Age</th>
      <th>Start date</th>
      <th>Salary</th>
   </tr>
</thead>
<tbody>
...

这是我的工作版本:jsfiddle