Jqgrid in a dialog window is not showing on the second calling

I have this script below that will call my browse window;

var $dialog = $('<div></div>')
    .load('scripts/browsecharges.jsp')
    .dialog({
        width: 800,
        height: 500,
        modal: false,
        title:开发者_开发知识库 'Browse Charges',
        buttons: {
            Ok: function() {
                $(this).dialog('destroy');
            }
        },
        close: function(event, ui) {
            $(this).dialog('destroy').remove();
        }
    });
    $dialog.dialog('open');

This browse window contains a jqgrid in it. At first my jqgrid works fine, I can see the data. But calling this browse window for the second time, my jqgrid will not show anymore. What should I do to open it as many times as I want?

Perhaps you need to call GridUnload prior to creating the grid, to ensure any elements from the previous grid are cleaned up.

I had this problem when a page was load via a .ajax call. The page contained dialogs with grids. On the first call everything worked great, on the second call (loaded another page and then reloaded the page) I would get an empty jqGrid, event though msg.d was clearly being set properly. The answer was when I left the page (loaded another page via .ajx) to destroy and remove the grid ($(this).dialog('destroy').remove()).