Проблема с наложением jqGrid

Я прихожу к следующей проблеме после этого сообщения.

После загрузки данных серый оверлей охватывает все на странице, но данные сетки. Ответ на этот вопрос - lui_list. Любая идея, как это решить?

Вот как я запускаю jqgrid scirpt:

<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#list").jqGrid({
            url: '/Ticket/All/',
            datatype: 'json',
            mtype: 'GET',
            colNames: ['Id', 'Hardware', 'Issue', 'IssueDetails', 'RequestedBy', 'AssignedTo', 'Priority', 'State'],
            colModel: [
          { name: 'Id', index: 'Id', key: true, width: 100 },
          { name: 'Hardware', index: 'Hardware', width: 100 },
          { name: 'Issue', index: 'Issue', width: 200 },
          { name: 'IssueDetails', index: 'IssueDetails', width: 200 },
          { name: 'RequestedBy', index: 'RequestedBy', width: 150 },
          { name: 'AssignedTo', index: 'AssignedTo', width: 150 },
          { name: 'Priority', index: 'Priority', width: 100 },
          { name: 'State', index: 'State', width: 100}],
            pager: jQuery('#pager'),
            rowNum: 10,
            rowList: [5, 10, 20, 50],
            sortname: 'Id',
            sortorder: "desc",
            viewrecords: true,
            imgpath: '/Content/images/',
            caption: 'My first grid'
        });
    }); 
</script>

<h2>My Grid Data</h2>
<table id="list"></table>
<div id="pager"></div>

И заголовок html:

<link href="/Content/jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css"  />
<link href="/Content/ui.jgrid.css" rel="stylesheet" type="text/css"  />
<script type="text/javascript" src="/Scripts/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.5.custom.min.js"></script>
<script type="text/javascript" src="/Scripts/grid.locale-en.js" ></script>
<script type="text/javascript" src="/Scripts/jquery.jqGrid.min.js" ></script>

Любая помощь будет оценена.

Ответы

Ответ 1

Вы забыли включить специфичный jqgrid css файл! После включения этого файла ваша проблема решена.

Ответ 2

Я не знаю , почему оверлей останется отображаемым после окончания загрузки. Я могу только предположить, что вы используете некоторые классы CSS, такие как "загрузка", которые используются также во время загрузки jqGrid. Независимо от причины, вы можете решить проблему очень легко. Вы должны просто скрыть соответствующий div следующим кодом:

var grid_id = "list"; // jQuery("#list")[0].id;
var hideLoading = function () {
    jQuery("#lui_"+grid_id).hide();
    jQuery("#load_"+grid_id).hide();
}

jQuery("#list").jqGrid({
    // all current options
    loadComplete: function() {
        hideLoading();
    },
    loadError: function() {
        hideLoading();
    }
});