We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Grid width does not use full available screen width

Thread ID:

Created:

Updated:

Platform:

Replies:

128015 Dec 27,2016 03:11 AM Dec 28,2016 06:11 AM ASP.NET MVC 1
loading
Tags: Grid
Felix
Asked On December 27, 2016 03:11 AM

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 [Syncfusion]
Replied On December 28, 2016 06:11 AM

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.  


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

Regards, 
Prasanna Kumar N.S.V 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;