如何使用 JS 数据表将默认值设置为字段

How to set default value to field using JS DataTables?

本文关键字：设置字段默认值何使用 JS 数据表更新时间：2023-09-26

我正在使用JS数据表插件来呈现我的表，在某些行中，我在特定列中有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>

您需要使用 render

属性来定义将显示的内容。更改初始化代码，以便在显示列值之前使用 render 检查 null。在此示例中，如果列值为 null，则会显示连字符：

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
});