Gibt es eine Möglichkeit, mit jqGrid die Höhe automatisch an die Anzahl der Zeilen anzupassen? Aber wenn eine bestimmte Höhe erreicht ist, kann sich die Höhe nicht mehr erhöhen und die vertikale Bildlaufleiste scheint zu sein.
Danke: D
Ich würde Ihnen empfehlen, die "max-height"
-Eigenschaft für das bdiv von jqGrid festzulegen und height:'100%'
oder height:'auto'
zu verwenden:
$("#list").parents('div.ui-jqgrid-bdiv').css("max-height","300px");
Die "max-height"
-Eigenschaft wird nicht von IE6 verwendet, aber neuere Webbrowser verwenden sie.
UPDATED: Free jqGrid führt in Version 4.10.0 eine neue Eigenschaft ein: maxHeight
, die genau wie oben beschrieben vorgeht. Daher kann man einfach maxHeight: 300
anstelle der manuellen Einstellung von max-height
des übergeordneten div.ui-jqgrid-bdiv
verwenden.
versuche dies
jQuery("#yourid").jqGrid({
........
height:'auto'
});
.ui-jqgrid-view {
max-height: 642px;
}
.ui-jqgrid-bdiv {
overflow-y: scroll !important;
max-height: 600px !important;
}
diese Arbeit an meinem jqGrid
Versuchen Sie diese Methoden
1. Definieren Sie eine Höhe innerhalb des Gitters
$("#griname").jqGrid(
{
rowNum : 1000,
viewrecords : true,
gridview : true,
autoencode : true,
loadonce : true,
width: "100%",
height: 300,
});
2. Mit dieser Funktion kann die Höhe auf einem vordefinierten Wert fixiert werden.
$(window).resize(function() {
if (typeof($gridname) !== 'undefined' && $("#gridname").length > 0) {
$discrepanciesResultGrid.setGridHeight(
$(window).height() - $("#gridname").position().top - 210
);
$gridname.setGridWidth($("body").width() - $("#anothercomponenetname").width() - 50);
}
Unsere Benutzeroberfläche löste das Problem (erweitern Sie die Liste auf 300px, wenn mehr als 10 Anhänge vorhanden sind, zeigen Sie eine vertikale Bildlaufleiste an) mit css
#gview_list_Attachments .ui-jqgrid-bdiv{
max-height: 300px;
overflow-y: visible;
}
300px ist in unserem Fall eine Höhe von 10 Elementen. Natürlich können Sie mit Jquery die Höhe eines Artikels bestimmen und mit 10 multiplizieren. Diese Lösung war jedoch schnell, einfach und löste unser Problem.
Versuche dies
$("#list1").parents(".ui-jqgrid-bdiv").css('height', jQuery("#list1").css('height'));
Dieser Code passt die Rasterhöhe entsprechend der Anzahl der Zeilen in einem Raster an
Füge das hinzu:
var height = $(window).height();
$('.ui-jqgrid-bdiv').height(height);
nachdem ich jqgrid auf der gewünschten Seite geladen hatte, funktionierte es für mich.
Je nach Bedarf können Sie min-hight, max-height oder height als folgenden Code im Skriptteil der Ansicht oder Seite verwenden:
$(window).load(
function () {
$('.ui-jqgrid-bdiv').css("min-height", "150px");
}
)
Ich benutze $ (window) .load (, weil es nach allen Skripten geladen wird.
Ich habe es korrigiert, indem ich das height-Attribut des jqgrid als 30% (height: '30% ') und den folgenden CSS-Code verwendet:
.ui-jqgrid-bdiv {
min-height:150px;
}