Flexigrid - set Breite von Grid in Code

Question

Ich versuche, herauszufinden Flexigrid für eine neue App - ich bin wirklich beeindruckt mit ihm, aber ich kann nicht einen Weg, um die Breite im Code finden.

Der Hauptgrund dafür ist, um das Raster zu bekommen (nicht die Spalten innerhalb des Gitters) vollständig auf die Größe des Fensters anzupassen. Ich weiß, es eine Verhöhnung des horizontalen Resizer macht, aber das ist, was ich zu tun habe!

FYI meine Einrichtung ist folgende:

$(document).ready(function() {
    $("#flex1").flexigrid
    (
    {
        url: '<%= ResolveUrl("~/Data.ashx") %>?filter=none',
        dataType: 'json',
        colModel: [
        { display: '', name: 'view', width: 20, sortable: true, align: 'center' },
        { display: 'Street', name: 'Street', width: 260, sortable: true, align: 'left' },
        { display: 'Town', name: 'Town', width: 200, sortable: true, align: 'left' },
        { display: '', name:'Actions', width:30, sortable: false, align: 'center' }
        ],
        sortname: "Street",
        sortorder: "asc",
        usepager: true,
        title: 'Streets',
        useRp: true,
        rp: 15,
        showTableToggleBtn: false,
        width: 800,
        height: 200
    }
    );
});

aber die folgende Funktion nicht funktioniert:

function ResizeGrid() {
    $('#flex1').flexOptions({ width:1000 }).flexReload();
}

Es bewirkt, dass das Raster zu aktualisieren, aber nicht mehr.

Answer 1

Trotz etwa 20 Minuten lang kein Glück auf Google, die vor der Veröffentlichung dieses bedeutete Murphys Gesetz, dass ich eine weitere schnelle Suche habe gerade versucht, danach und fand die Antwort.

Es stellte sich heraus, dass „Breite“ sollte auf ‚auto‘ gesetzt werden (man beachte die Anführungszeichen sind wichtig).

$("#flex1").flexigrid
(
{
    url: '<%= ResolveUrl("~/Data.ashx") %>?filter=none',
    dataType: 'json',
    colModel: [
    { display: '', name: 'view', width: 20, sortable: true, align: 'center' },
    { display: 'Street', name: 'Street', width: 260, sortable: true, align: 'left' },
    { display: 'Town', name: 'Town', width: 200, sortable: true, align: 'left' },
    { display: '', name:'Actions', width:30, sortable: false, align: 'center' }
    ],
    sortname: "Street",
    sortorder: "asc",
    usepager: true,
    title: 'Streets',
    useRp: true,
    rp: 15,
    showTableToggleBtn: false,
    width: 'auto',
    height: 200
}
);

Ich werde diesen Eintrag für alle anderen, die dieses Problem hat.