// Reloads the grid
new MvcGrid(document.querySelector('.mvc-grid')).reload();

// Clears all query values associated with the grid name
new MvcGrid(document.querySelector('.mvc-grid')).clearQuery();

var grid = document.querySelector('.mvc-grid');

// Triggered when grid's row is clicked. It's recommended to use event delegation in ajax scenarios.
document.addEventListener('rowclick', function(e) {
    e.detail.data - clicked row's data from columns.
    e.detail.grid - grid's instance.
    e.detail.originalEvent - original tr click event which triggered the rowclick.
});

// Triggered before grid starts loading. It's recommended to use event delegation in ajax scenarios.
document.addEventListener('reloadstart', function (e) {
    e.detail.grid - grid's instance.
});

// Triggered after grid stop loading. It's recommended to use event delegation in ajax scenarios.
document.addEventListener('reloadend', function (e) {
    e.detail.grid - grid's instance.
});

// Triggered after grid reload fails. It's recommended to use event delegation in ajax scenarios.
document.addEventListener('reloadfail', function (e) {
    e.detail.result - failed ajax response result.
    e.detail.grid - grid's instance.
});