如何使用JS DataTables将默认值设置为field?

时间:2016-02-25 11:54:40

标签: javascript jquery datatables

我使用JS DataTables插件来渲染我的表,在某些行中我在特定列中有NULL值:

我的数据集看起来像这样,并且生成表并在服务器端呈现。

Array
(
    [0] => Array
        (
            [HostingID] => 1
            [UserID] => 1
            [HostingDomain] => reasda.hrt
            [Coupon] => coupon1
        )

    [1] => Array
        (
            [HostingID] => 2
            [UserID] => 1
            [HostingDomain] => asdasd.hr
            [Coupon] => 
        )

    [2] => Array
        (
            [HostingID] => 3
            [UserID] => 1
            [HostingDomain] => asdasds-hre
            [Coupon] => 
        )
)

我的JS很简单,因为一些默认设置在包含文件中初始化。

<script type="text/javascript">
    jQuery(document).ready( function ()
    {
        var table = jQuery('#tableActiveHostingServicesList').removeClass('hidden').DataTable( );

        table.draw();
        jQuery('#tableLoading').addClass('hidden');
    });
</script>

这是我的观点部分:

<table id="tableActiveHostingServicesList" class="table table-list hidden">
                <thead>
                    <tr>
                        <th>First column</th>
                        <th>Second column</th>
                        <th>Third column</th>
                    </tr>
                </thead>
                <tbody>
                    {foreach from=$activeservices item=activeservice}
                        <tr>

                            <td class="text-center">{$activeservice.HostingDomain}</td>
                            <td class="text-center">{$activeservice.Coupon}</span></td>
                            <td class="text-center">
                                <a href="" class="btn btn-block btn-info">
                                    Reedem!
                                </a>
                            </td>
                        </tr>
                    {/foreach}
                </tbody>
            </table>

1 个答案:

答案 0 :(得分:0)

您需要使用render属性来定义要显示的内容。更改初始化代码,以便在显示列值之前使用render来检查null。在此示例中,如果列值为null,则显示hypen:

var table = jQuery('#tableActiveHostingServicesList').removeClass('hidden').DataTable({
    'columns': [
     {
          // HostingID
          'render': function (data, type, full, meta) {
               if(full[0] != null){
                   return full[0];
                }else{
                   return '-';
                }
            },
          // UserID
          'render': function (data, type, full, meta) {
               if(full[1] != null){
                   return full[1];
                }else{
                   return '-';
                }
            },
            ... etc
});