Так что у меня небольшая проблема с отображением jqGrid.Я не могу утверждать, что это ошибка, сама по себе, но она сбивает с толку моих пользователей, и поэтому меня попросили разобраться с ней - но, похоже, она меня одолела.
Я используюподсетки, где расширение строки родительской сетки приводит к загрузке подсетки (см. код ниже).Я упростил всю конфигурацию, чтобы ее было легче читать, в основном просто удалив все столбцы, кроме одного, и сохранив простоту colModel.Родительская сетка имеет горизонтальную полосу прокрутки для возможности прокрутки справа налево, чтобы увидеть данные, которые могут отсутствовать на экране.Когда экран достаточно велик для отображения всех данных, горизонтальная полоса прокрутки на родительской сетке исчезает.
Когда загружается подсетка, она загружается с шириной 100%, что прекрасно работает.Родительская сетка расширяется, что позволяет отображать всю подсеть, а горизонтальная полоса прокрутки родительской сетки позволяет прокручивать назад и вперед, чтобы увидеть все данные.Существует одна полоса прокрутки для всей горизонтальной прокрутки, независимо от того, отображается ли количество подсетей или сколько их.
К сожалению, во вспомогательной сетке также отображается горизонтальная полоса прокрутки - но поскольку ширина сетки составляет 100%,эта полоса прокрутки ничего не «делает» - за исключением того, что пользователь вводит в заблуждение мысль, что больше нет данных для просмотра, когда они пытаются использовать ее для прокрутки, и ничего не движется.
Есть ли какой-либо способ через конфигурацию jqGrid илиCSS "магия", что я могу скрыть эту горизонтальную полосу прокрутки на подсетке?Я использовал инструменты разработчика Chrome, но, похоже, нет тега DIV, связанного конкретно с полосой прокрутки, только заголовок, заголовок и строки данных.
Версии:
- jQuery: 1.4.2
- jQueryUI: 1.8.5
- jqGrid: 3.8.1
- Браузеры: Chrome 8, IE 8
jQuery(document).ready(function () {
jQuery('#ParentGrid').jqGrid({
url: '[URL TO GET DATA]',
width: '100%',
height: '100%',
shrinkToFit: 'false',
datatype: 'json',
mtype: 'POST',
jsonReader: { repeatitems: false },
sortname: 'ParentRowID',
sortorder: 'asc',
colNames: [
'Parent Row ID'
],
colModel: [
{ name: 'ParentRowID', index: 'ParentRowID', width: 110, align: 'left' }
],
gridComplete: function () {
$('.ui-jqgrid-titlebar-close', '#ParentGrid').remove();
},
subGrid: true,
subGridRowExpanded: function (subgrid_id, row_id) {
var subgrid_table_id = subgrid_id + '_t';
$('#' + subgrid_id).html("<table id='" + subgrid_table_id + "' cellpadding='0' cellspacing='0'></table>");
$('#' + subgrid_table_id).jqGrid({
url: '[URL TO GET DATA BASED ON PARENT GRID SELECTED ROW ID]',
width: '100%',
height: '100%',
shrinkToFit: 'false',
datatype: 'json',
mtype: 'POST',
jsonReader: { repeatitems: false },
sortname: 'ChildRowID',
sortorder: 'asc',
colNames: [
'Child Row ID'
],
colModel: [
{ name: 'ChildRowID', index: 'ChildRowID', width: 110, align: 'left' }
],
gridComplete: function () {
$('.ui-jqgrid-titlebar-close', '#' + subgrid_table_id).remove();
}
});
}
});
});