Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
215
How do I set the grid width to 100% of a dialog?
posted

I'm using the igDialog to show a grid using an external IFRAME as documented at 
http://ko.infragistics.com/products/jquery/sample/dialog-window/loading-external-page 
I have made the dialog modal. 


I am trying to make the width of the grid automatically the size of the dialog, and according to your width property a percentage can be specified for your Width and Height properties... Yet the my grid is about a 5th of the width of the dialog, just wide enough to fit in the text for the column headers.
How do I make the grid fit the dialog width?

@(Html.Infragistics().Grid(Model.AsQueryable()).ID("grid1").PrimaryKey("id").Width("100%")
.Columns(column =>
{
column.For(x => x.id).HeaderText("ID").Hidden(true);
column.For(x => x.firstname).HeaderText("First name");
column.For(x => x.lastname).HeaderText("Last name");
})
.AutoCommit(true)
.AutoGenerateColumns(false)
.Features(features =>
{
features.Updating().EditMode(GridEditMode.Row).EnableAddRow(true).StartEditTriggers(GridStartEditTriggers.DblClick);
})
.DataSourceUrl(Url.Action("GetParentsSiblingsUSAGridData"))
.UpdateUrl(Url.Action("EditingSaveChanges"))

.DataBind()
.Render())

  • 15979
    Verified Answer
    posted

    Hello Greg,

    When grid or any other HTML element is set to 100% size it will attempt to take 100% of its parent container.

    This means you will have to set all grid surrounding elements (if any) to have also 100% size.

    Inspect the page added as frame in the dialog and make sure that all elements surrounding the grid are also set to full size in %.