Is it possible to stop a JqGrid from flickering on reload?

Question

Whenever I call trigger("reloadGrid") on a JqGrid, it clears the existing table, displays a "loading" message, and then regenerates the existing data - the whole process just takes a few milliseconds, but it makes the user interface feel unpolished if it happens a lot. Is it possible to stop it from clearing and showing the loading message, and just replace with the latest dta?

Answer 1

If you just want to stop the loading message from appearing, you can use the loadui option, i.e. when initializing the grid:

$("#grid").jqGrid({
    url: "/site/data",
    loadui: "disable",
    ...
);

If you need to change this on the fly, use the setGridParam method. The other options for loadui are "enable" (show the loading message) and "block" (same, but prevents any other input while loading).

Answer 2

Unfortunately jqGrid clears out the contents of the table before making the AJAX call, so as long as it's waiting for an answer, the table is empty.

This is less of an issue if you use a fixed-height table with scrolling, but in most cases I have fairly short tables and prefer to display the full contents at once and just scroll down on the page as necessary. The following tweak applies a min-height value to the wrapper div around each table each time the table is loaded (this needs to be called from gridInitialized()):

        function freezeHeight() {
            var $tableWrapper = getContainer($grid).find(".ui-jqgrid-bdiv");
            $tableWrapper.css("min-height", $tableWrapper.outerHeight());
        }