jQuery datagridview events

The jQuery-datagrid provides a number of events that you can subscribe to with the jQuery syntax.

<div id="example-table"></div>

<script type="text/javascript">
    $('#example-table').datagridview({
        columns: [
            { data: 'firstName' },
            { data: 'lastName' }
        ]
    }).on('datagridview.sorted', function (event, metaData) {
        // Get your new data here, based on the provided meta data and any other parameters
        // Normally populating might happen in the success-callback of an AJAX-function
        let data = [];

        $(this).datagridview(function () {
            this.populate(metaData, data);
        });
    });
</script>

Events

• datagridview.selectionChanged fires whenever the selected rows get changed; it provides an array of selected data in its second parameter
• datagridview.sorted fires whenever a sortable header gets clicked; it provides the new meta data in its second parameter
• datagridview.paged fires whenever paging is initiated; it provides the new meta data in its second parameter
• datagridview.columnMoved fires whenever a column is moved; it provides the new column definitions in its second parameter
• datagridview.columnResized fires whenever a column is resized; it provides the new column definitions in its second parameter