javascript - FlexiGrid - set width of Grid in code - Stack Overflow

admin管理员组

文章数量:1356294

I'm trying out Flexigrid for a new app - I'm really impressed with it but I can't find a way to set the width in code.

The main reason for this is to get the GRID (not the columns inside the grid) to align fully to the size of the window. I know, it makes a mockery of the horizontal resizer, but that's what I have to do!

FYI my set up is the following:

$(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
    }
    );
});

but the following function doesn't work:

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

It causes the grid to refresh, but nothing more.

I'm trying out Flexigrid for a new app - I'm really impressed with it but I can't find a way to set the width in code.

The main reason for this is to get the GRID (not the columns inside the grid) to align fully to the size of the window. I know, it makes a mockery of the horizontal resizer, but that's what I have to do!

FYI my set up is the following:

$(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
    }
    );
});

but the following function doesn't work:

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

It causes the grid to refresh, but nothing more.

• javascript
• jquery
• flexigrid

Share Improve this question Follow edited Nov 17, 2011 at 17:00 Jason Plank 2,33255 gold badges3232 silver badges4040 bronze badges asked Mar 26, 2009 at 14:01 DuncanDuncan 10.3k1414 gold badges6666 silver badges9696 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

Despite having NO LUCK on google for about 20 minutes before posting this, Murphy's law meant that I tried another quick search just afterwards and found the answer.

Turns out that "width" should be set to 'auto' (note the quotes are vital).

$("#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
}
);

I'll leave this post for anyone else who has this problem.

本文标签： javascriptFlexiGridset width of Grid in codeStack Overflow