webentwicklung-frage-antwort-db.com.de

jqGrid mit automatischer Höhe; hat aber eine maximale Höhe und Bildlaufleisten

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

24
Dieter

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.

31
Oleg

versuche dies 

jQuery("#yourid").jqGrid({  
    ........
    height:'auto'
}); 
12
Chester
.ui-jqgrid-view {
    max-height: 642px;
}
.ui-jqgrid-bdiv {
    overflow-y: scroll !important;
    max-height: 600px !important;
}

diese Arbeit an meinem jqGrid

2
lambdie

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);
    }
2
shermi

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.

1
JayJay

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

0
yogesh Dhale

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.

0
user1364237

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.

0
Zolfaghari

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;
        }

0
user3224132