0 items
Sign in
Buy

Docs

Customizing DataTables Options in GravityView

Estimated reading: 12 minutes

Updated on April 24, 2026

The DataTables layout in GravityView uses the powerful DataTables JavaScript library to display your form entries in an interactive table. You can customize nearly every aspect of how DataTables behaves using filters.

The Main Filter #

The gravityview_datatables_js_options  filter allows you to modify DataTables configuration options. Here’s the basic structure:

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id, $post ) {
    // Modify $dt_config array here
    return $dt_config;
}, 20, 3 );

The filter provides three parameters:

  • $dt_config (array) – The complete DataTables configuration
  • $view_id (int) – The ID of the View being displayed
  • $post (WP_Post) – The current post or page where the View is embedded

Targeting Specific Views #

You can apply customizations to all Views or target specific ones:

Single View

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id, $post ) {
    // Only apply to View ID 123
    if ( 123 !== $view_id ) {
        return $dt_config;
    }

    $dt_config['searching'] = false;
    return $dt_config;
}, 20, 3 );

Multiple Views

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id, $post ) {
    $target_views = [ 123, 456, 789 ];

    if ( in_array( $view_id, $target_views, true ) ) {
        $dt_config['paging'] = false;
    }

    return $dt_config;
}, 20, 3 );

Page Length Options #

The lengthMenu  option controls which values appear in the “Show X entries” dropdown. The pageLength  option sets the default.

The gravityview_datatables_lengthmenu  filter is the easiest way to customize the dropdown. GravityView automatically handles the “All” label for -1 :

add_filter( 'gravityview_datatables_lengthmenu', function( $values, $view_data ) {
    // Key = actual value, Value = displayed label
    // -1 means "show all entries"
    return [
        10  => 10,
        25  => 25,
        50  => 50,
        100 => 100,
        250 => 250,
        -1  => 'All',
    ];
}, 10, 2 );

Using the Main Options Filter

If you use gravityview_datatables_js_options  to set lengthMenu , you must use DataTables’ 2D array format for custom labels:

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // 2D array: [ [values], [labels] ]
    // -1 shows all entries, displayed as "All"
    $dt_config['lengthMenu'] = [
        [ 10, 25, 50, 100, -1 ],      // Actual values
        [ 10, 25, 50, 100, 'All' ]    // Display labels
    ];

    // Default to 25 entries per page
    $dt_config['pageLength'] = 25;

    return $dt_config;
} );

Important: If you use a simple array like [ 10, 25, 50, -1 ] , the dropdown will show “-1” instead of “All”. Always use the 2D array format when you need custom labels.

Search and Filter #

The searching  option controls the built-in DataTables search box (not the GravityView Search Bar widget):

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Disable the DataTables search box
    $dt_config['searching'] = false;

    return $dt_config;
} );

If you’re using the GravityView Search Bar widget, you may want to disable the DataTables search box to avoid duplicate search inputs. See How to disable the DataTables search box.

Pagination Controls #

Disable Pagination

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Disable pagination (show all entries)
    $dt_config['paging'] = false;

    return $dt_config;
} );

Hide Page Length Dropdown

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Hide the "Show X entries" dropdown
    $dt_config['lengthChange'] = false;

    return $dt_config;
} );

Hide Table Information

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Hide the "Showing 1 to 10 of 50 entries" text
    $dt_config['info'] = false;

    return $dt_config;
} );

Column Sorting #

Disable All Sorting

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    $dt_config['ordering'] = false;

    return $dt_config;
} );

Disable Sorting on Specific Columns

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Initialize columnDefs if not set (important for merging)
    if ( ! isset( $dt_config['columnDefs'] ) ) {
        $dt_config['columnDefs'] = [];
    }

    // Append to existing columnDefs (don't override!)
    $dt_config['columnDefs'][] = [
        'targets'   => 0,       // First column (0-indexed)
        'orderable' => false,
    ];

    return $dt_config;
} );

Set Default Sort Order

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Sort by third column (index 2) in descending order
    $dt_config['order'] = [
        [ 2, 'desc' ]
    ];

    return $dt_config;
} );

Disable Default Sorting

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Disable default sorting entirely
    $dt_config['order'] = [];

    return $dt_config;
} );

Column Configuration #

Use columnDefs  to configure individual columns. Important: Always append to existing columnDefs  rather than replacing them, as GravityView may have set columnDefs for hidden sort columns.

Add Custom CSS Classes

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    if ( ! isset( $dt_config['columnDefs'] ) ) {
        $dt_config['columnDefs'] = [];
    }

    $dt_config['columnDefs'][] = [
        'targets'   => 0,                   // First column
        'className' => 'my-custom-class',   // CSS class name
    ];

    return $dt_config;
} );

Hide Columns

You can hide columns while keeping them available for search and export:

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id ) {
    if ( 123 !== $view_id ) {
        return $dt_config;
    }

    if ( ! isset( $dt_config['columnDefs'] ) ) {
        $dt_config['columnDefs'] = [];
    }

    // Hide columns by index (0-based)
    $dt_config['columnDefs'][] = [
        'targets' => [ 1, 3 ],   // Hide second and fourth columns
        'visible' => false,
    ];

    return $dt_config;
}, 20, 2 );

Set Column Widths

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    if ( ! isset( $dt_config['columnDefs'] ) ) {
        $dt_config['columnDefs'] = [];
    }

    $dt_config['columnDefs'][] = [
        'targets' => 0,
        'width'   => '100px',
    ];

    $dt_config['columnDefs'][] = [
        'targets' => 2,
        'width'   => '30%',
    ];

    return $dt_config;
} );

Processing Message #

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // Disable the "Loading data..." message
    $dt_config['processing'] = false;

    return $dt_config;
} );

To customize the loading text instead:

add_filter( 'gravityview_datatables_loading_text', function( $text, $view ) {
    return 'Please wait, loading entries...';
}, 10, 2 );

See also: How to disable the “Loading data” message.

Export Buttons #

The buttons  option adds export functionality. First, enable “Buttons” in your View’s DataTables settings.

CSV Export with UTF-8

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    $dt_config['buttons'] = [
        [
            'extend'  => 'csv',
            'charset' => 'UTF-8',
            'bom'     => true,      // Byte Order Mark for Excel compatibility
            'header'  => true,      // Include column headers
        ]
    ];

    return $dt_config;
} );

PDF Export

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id ) {
    if ( 123 !== $view_id ) {
        return $dt_config;
    }

    $dt_config['buttons'] = [
        [
            'extend' => 'pdfHtml5',
            'title'  => 'My Custom Title'
        ]
    ];

    return $dt_config;
}, 20, 2 );

For more PDF customization, use the dedicated filter:

add_filter( 'gravityview/datatables/button_pdf', function( $button_config, $view_id ) {
    if ( 123 !== $view_id ) {
        return $button_config;
    }

    $button_config['title']    = 'My PDF Report';
    $button_config['filename'] = 'entries-export';

    return $button_config;
}, 10, 2 );

Multiple Export Buttons

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    $dt_config['buttons'] = [
        [
            'extend' => 'csv',
            'header' => false       // CSV without headers
        ],
        [
            'extend' => 'pdfHtml5',
            'title'  => 'My Report'
        ],
        [
            'extend' => 'print'
        ]
    ];

    return $dt_config;
} );
add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    $dt_config['select'] = true;  // Enable row selection

    $dt_config['buttons'] = [
        [
            'extend'        => 'print',
            'text'          => 'Print all',
            'exportOptions' => [
                'modifier' => [
                    'selected' => null  // Print all rows
                ]
            ]
        ],
        [
            'extend' => 'print',
            'text'   => 'Print selected'
        ]
    ];

    return $dt_config;
} );

See also: How to customize the CSV field separator.

Customizing Text and Labels #

add_filter( 'gravityview/datatables/config/language', function( $labels ) {
    $labels['emptyTable']  = 'No entries found.';
    $labels['zeroRecords'] = 'No matching entries found.';
    $labels['info']        = 'Showing _START_ to _END_ of _TOTAL_ results';
    $labels['infoEmpty']   = 'No entries available';
    $labels['search']      = 'Search:';

    return $labels;
} );

See also: How to customize the “No matching records found” text.

Field Filter Placeholders #

When using DataTables Field Filters, customize the placeholder text:

add_filter( 'gravityview/datatables/field_filters/placeholder', function( $placeholder, $field_label ) {
    return 'Search by ' . $field_label . '...';
}, 10, 2 );

Complete Examples #

Minimal Table (No Controls)

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id ) {
    if ( 123 !== $view_id ) {
        return $dt_config;
    }

    $dt_config['searching']    = false;   // No search box
    $dt_config['lengthChange'] = false;   // No page length dropdown
    $dt_config['ordering']     = false;   // No column sorting
    $dt_config['info']         = false;   // No "Showing X of Y" text
    $dt_config['paging']       = false;   // No pagination

    return $dt_config;
}, 20, 2 );

Large Dataset Configuration

add_filter( 'gravityview_datatables_js_options', function( $dt_config ) {
    // 2D array format for proper "All" label display
    $dt_config['lengthMenu'] = [
        [ 25, 50, 100, 250, 500, -1 ],
        [ 25, 50, 100, 250, 500, 'All' ]
    ];
    $dt_config['pageLength'] = 100;

    return $dt_config;
} );

Export-Ready Table

add_filter( 'gravityview_datatables_js_options', function( $dt_config, $view_id ) {
    if ( 456 !== $view_id ) {
        return $dt_config;
    }

    $dt_config['buttons'] = [
        [
            'extend'  => 'csv',
            'charset' => 'UTF-8',
            'bom'     => true
        ],
        [
            'extend' => 'pdfHtml5',
            'title'  => 'Entry Report'
        ],
        [
            'extend' => 'print'
        ]
    ];

    $dt_config['order'] = [];
    // 2D array format for proper "All" label
    $dt_config['lengthMenu'] = [
        [ 25, 50, 100, -1 ],
        [ 25, 50, 100, 'All' ]
    ];
    $dt_config['pageLength'] = 50;

    return $dt_config;
}, 20, 2 );

Options Reference #

OptionTypeDescription
lengthMenu arrayPage length options (use 2D array for custom labels)
pageLength intDefault entries per page
lengthChange boolShow/hide page length dropdown
paging boolEnable/disable pagination
searching boolEnable/disable search box
ordering boolEnable/disable column sorting
info boolShow/hide table information
processing boolShow/hide loading message
order arrayDefault sort column and direction
columnDefs arrayPer-column configuration (always append, don’t replace)
buttons arrayExport button configuration

For all DataTables options, see the DataTables Options Reference.

Where to Add Code #

Add these code snippets to your site following the instructions in Where to put code samples.

Important: Always test code on a staging site before adding to production.

Related Articles #

Was this page helpful?

Table Of Contents