jqGrid nicht richtig wiedergegeben in Chrom/Chrome Frame

Ich heute aktualisiert mein Chrome-version 19, haben, reproduziert das problem und machte die entsprechenden quick&dirty fix:

Schlage ich vor zu ändern die Zeile von jqGrid-code

isSafari = $.browser.webkit || $.browser.safari ? true : false;

den folgenden

isSafari = ($.browser.webkit || $.browser.safari) &&
    parseFloat($.browser.version)<536.5 ? true : false; //Chrome < version 19

Die demo das Update verwenden. Die Feste version der jquery.jqGrid.src.js was ich in der demo können Sie bekommen hier.

Getestet habe ich es im IE9 (v9.0.8112.16421), IE8 (8.0.6001.18702 CO), Chrom 18.0.125.168, Chrome 19.0.1084.46 Safari 5.1.7 (7534.57.2), Firefox 12, Opera 11.62. In allen web-Browsern, die demo hat keine horizontalen Scrollbalken und es sieht aus wie folgt:

In der Zukunft wäre es besser, zu ändern, die Berechnung der Breite des Gitters mehr Tiefe zu haben, die keine direkte Abhängigkeit von einer beliebigen version-Nummer oder web-browser. Ich hoffe, es wird möglich sein, wenn für den Einsatz mehr jQuery-Methoden $.Breite und $.outerWidth in einigen Orten von jqGrid. In irgendeiner Weise hoffe ich, dass die oben beschriebene fix wäre schon hilfreich für viele jqGrid Benutzer.

AKTUALISIERT: ich habe meine Vorschlag trirand als der bug-report.

AKTUALISIERT 2: um genau Zu sein sind es drei stellen im code, wo sind die gleichen $.browser.webkit || $.browser.safari - Konstrukt, wie oben beschrieben: innerhalb setGridWidth, innerhalb von getOffset, innerhalb der Berechnung der Breite von multiselect Spalte, innerhalb showHideCol und innerhalb setGridWidth. Die ersten drei Plätze verwendet isSafari variable. Die letzten zwei stellen verwendet $.browser.webkit || $.browser.safari direkt. Sollte man ersetzen in allen Orten, den code

$.browser.webkit||$.browser.safari

zu

($.browser.webkit || $.browser.safari) && parseFloat($.browser.version)<536.5

Also sollte man dies tun, in drei Plätze:

1. bei der definition der isSafari (sehen mir original-post)
2. innerhalb von showHideCol
3. innerhalb von setGridWidth

Können Sie die korrigierte version des jquery.jqGrid.src mit den Korrekturen hier. Sie können die gleichen änderungen in den code von jquery.jqGrid.src selbst wenn Sie die alte version von jqGrid. Erstellt minimierte version für die Produktion können Sie alle minimizer, die Sie gut kennen. Ich benutze zum Beispiel Microsoft Ajax Minifier 4.0. Einfach installieren Sie und führen Sie

AjaxMin.exe jquery.jqGrid.src-fixed3.js -o jquery.jqGrid.min-fixed3.js

Als Ergebnis erhalten Sie jquery.jqGrid.min-fixed3.js, die sogar noch kleiner als original jquery.jqGrid.min.js. Auch, wenn Sie das Kommentar-header der Datei (siehe geänderte Datei) wird die Datei noch kleiner als die Originale version von jquery.jqGrid.min.js.

Nach einigen Iterationen meiner bug-report und die Verbesserungen gibt es eine weitere version des Updates wo die Methode cellWidth eingeführt wurde:

cellWidth : function () {
    var $testDiv = $("<div class='ui-jqgrid' style='left:10000px'><table class='ui-jqgrid-btable' style='width:5px;'><tr class='jqgrow'><td style='width:5px;'></td></tr></table></div>"),
        testCell = $testDiv.appendTo("body")
            .find("td")
            .width();
        $testDiv.remove();
        return testCell !== 5;
}

Sehen hier. Wenn Sie lieber dem Weg Folgen, können Sie dies auch tun. In dem Fall, In allen Orten, wo isSafari oder $.browser.webkit || $.browser.safari (in showHideCol und setGridWidth) verwendet werden, können Sie $.jgrid.cellWidth() statt.

AKTUALISIERT 3: Heute veröffentlicht wurde jqGrid 4.3.3 enthält das Update welches ich oben beschrieben habe (die cellWidth - Methode). Also ich empfehle allen die neue version verwenden.

AKTUALISIERT 4: Google Chrome 20 verwendet WebKit 536.11. Also alle, die nicht die Letzte version von jqGrid mit der festen Berechnung der Breite verwenden sollte parseFloat($.browser.version)<536.11 (oder etwas enger) statt parseFloat($.browser.version)<536.5 beschrieben, die zu Beginn der Antwort. Google Chrome 23 WebKit verwendet 537.11.

InformationsquelleAutor Oleg

Oleg ' s Antwort ist richtig. Allerdings, wenn Sie eine ältere version von jqGrid und anwenden möchten diese behebt, kann es einfacher sein, nehmen Sie die änderungen direkt aus der diffs auf Github. Ich getestet habe dies erfolgreich mit jqGrid 4.0.0, also vermutlich wird es auf keiner der 4.x-Serie.

Nur beginnen Sie mit der ersten vergleichen und anwenden jeden von Ihnen um. Dies wird fügen Sie cellWidth - Funktion und machen Sie alle notwendigen änderungen in der jquery.jqGrid.src.js Datei. Dann können Sie den Google closure compiler, wenn Sie möchten, erstellen Sie eine minified-version:

• 8c56dc8
• b50b55f
• cf26b2c
• 8d7eff0
• 46a14ce

Es scheint wie eine Menge änderungen, aber wenn Sie schauen Sie sich die aktuellen code-änderungen gehen sehr schnell. Nur ein paar Quellcode-Zeilen betroffen sind.

InformationsquelleAutor Justin Ethier

Update: Meine anwswer bezieht sich auf ein ähnliches Problem, das passiert in Firefox vor ein paar Monaten, und ich schlug vor, in der Hoffnung, es würde Arbeit für Chrome 19, derzeit aber Oleg ' s Antwort ist der richtige Ansatz.

Ich hatte ein ähnliches Problem vor ein paar Monaten mit FF und ich war mit dem ForceFit option, die verhindern soll, das HScroll und ganz aber wie du Sie erwähnt hast würde ich noch bekommen, so dass ich nur deaktiviert die HScroll für meine forcefit Netze. Ein paar updates später von FF, der hat es halt passiert, und derzeit sind alle meine Netze sind fein in Chrome 18 wird es ja hoffentlich kein Problem sein, wenn 19 freigegeben wird.

//remove HScroll
function jqGridDisableHScroll(gridid) {
    //if columns are force fit all columns will always fit on screen.
    if ($('#' + gridid).jqGrid('getGridParam', 'forceFit')) {
        var gridview = $('#gview_' + gridid);
        $('.ui-jqgrid-bdiv', gridview).css({ 'overflow-x': 'hidden' });
    }
}

Force Fit

Wenn auf true gesetzt, und vergrößern Sie die Breite einer Spalte, der Spalte daneben (rechts) wird die Größe, so dass die gesamte Breite des Rasters ist gepflegt (z.B., dass die Breite von Spalte 2 durch 30px erhöht die Größe der Spalte 3 von 30px). In diesem Fall gibt es keine horizontalen scrolbar. Hinweis: diese option ist nicht kompatibel mit shrinkToFit option - i.e wenn shrinkToFit auf false gesetzt ist, forceFit ignoriert.

InformationsquelleAutor Chad Ferguson

Verwenden wir jgGrid 4.3.3 und cellWidth hat nicht das Problem zu lösen...um es zu lösen, fügte ich die Zeile return parseInt(testCell) !== 5; statt return testCell !== 5; im cellWidth Methode. Vielleicht ist es nicht die beste Lösung, aber es funktioniert für uns 🙂

InformationsquelleAutor Alex Dn