DataTables set default value for a column in initial loading of page

Question

I am having trouble with dataTables. How can i assign a default value in filter during initial loading of the page.

i found this link http://live.datatables.net/waselab/59/edit that filters the table initially by assigning a default { sSearch: 'London' } by using the searchCols in dataTable. https://datatables.net/reference/option/searchCols This is what i really need to output but seems to not work in my own example.

But when i tried it on my own, it wont take effect. is there any other approach for this.?

this is what i tried so far.. This is my 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,
    });

for my HTML part:

<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>

This is the table that is rendered in my HTML

i did the searchCols: part. but it wont do anything. please help.

You've set "serverSide": true, but where is the data coming from? — markpsmith
– markpsmith, Commented Feb 12, 2016 at 9:52
Yes, but HOW are you populating the datatable? I just don't see how you can initialise a server-side datatable without telling it where to get the data from. — markpsmith
– markpsmith, Commented Feb 12, 2016 at 10:02
You're not giving me much to work with here, but I'm assuming you're loading the data & populating the table, then applying the datatables init code? just remove "serverSide": true, — markpsmith
– markpsmith, Commented Feb 12, 2016 at 10:26

markpsmith · Accepted Answer · 2016-02-12 11:39:11Z

1

There's nothing wrong with your datatables code, the problem is your table HTML. Until you posted that link there's no way anyone could have helped you, which highlights the importance of giving as much information as possible.

Have a look at your table structure - the whole table content is within <thead>, there is no <tbody> section at all! I'm surprised datatables managed to render anything.

Make sure you close the thead section & start the tbody section correctly:

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

Here is my working version: jsfiddle

answered Feb 12, 2016 at 11:39

markpsmith

4,9182 gold badges38 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ii--L--ii Over a year ago

Thanks for this. but when i tried to implement it, it seems that something is wrong with somewhere else. im not really sure where..

Collectives™ on Stack Overflow

DataTables set default value for a column in initial loading of page

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related