Grid width does not use full available screen width

[Felix]

I am trying to use the maximum desktop width available for an ejGrid displaying multiple period columns. The data numbers display correctly.

The 'View' code is:
    <div id="Accordion">
        <!-- Builds accordion at side of screen -->
        @Html.Action("Index", "Accordion")
    </div>

<div id="Sales">
 
                            @(Html.EJ().Grid<PlaniumBP.Models.rowSale>("Editing")
            .Datasource(ds => ds.Json((IEnumerable<object>)ViewBag.datasource).UpdateURL("Update").InsertURL("Insert").RemoveURL("Remove").Adaptor(AdaptorType.RemoteSaveAdaptor))

            .EditSettings(edit => { edit.AllowAdding().AllowDeleting().AllowEditing().EditMode(EditMode.DialogTemplate).DialogEditorTemplateID("#template"); })
            .ContextMenuSettings(contextMenu => { contextMenu.EnableContextMenu(); })

            .ClientSideEvents(eve => { eve.EndEdit("endEdit"); eve.ActionComplete("complete"); eve.Create("active"); })

            .AllowScrolling()
            //.ScrollSettings(col => { col.Width("60%").Height("Auto"); })
            .ScrollSettings(col => { col.Width(900).Height(300); })
            .IsResponsive(true)
            .EnableResponsiveRow(true)

             .ToolbarSettings(toolbar =>
            {
                toolbar.ShowToolbar().ToolbarItems(items =>
                {
                    items.AddTool(ToolBarItems.Edit);
                    items.AddTool(ToolBarItems.PrintGrid);
                    items.AddTool(ToolBarItems.ExcelExport);
                    items.AddTool(ToolBarItems.WordExport);
                    items.AddTool(ToolBarItems.PdfExport);
                });
            })
          
//Some script to load a data list correctly to the grid table

            })

But, as you can see from the attached zip file, the grid stubbornly refuses to use the full width-space available to it. There will always be an Accordion on the left hand side for navigation.

What am I doing wrong? I have a whole set of 'Views' that need to be able to use whatever grid width is available to it on a particular screen?

I don't seem to be able to adjust the height of the grid either.

Thanking you in advance

Felix

Attachment: GridWidth1_a21a5f5.zip

[Prasanna Kumar Viswanathan]

Hi Felix, 

Thanks for contacting Syncfusion support.  

 

In the code example you set width as 900 in the scrollSettings API of ejGrid. When we mention the width in scrollSettings, the grid will grow horizontally according to the specific width. It is the default behavior of the grid. So, we suggest you to remove the scrollSettings API from your grid or specify the width and height properties of grid scrollSettings as “100%”.  

You have also mentioned that you unable to adjust the height of the grid. So, please confirm that you need to resize the height of the grid while resizing the browser window. If you need to resize the height according to the browser window we have to enable the isResponsive property and set height as 100% in scrollSettings API of ejGrid.  

Refer to the Help document for the responsive.  

https://help.syncfusion.com/aspnetmvc/grid/responsive 

If we misunderstood your query please get back to us with elaborating your requirement. 

Regards, 

Prasanna Kumar N.S.V