gustavnavar / Grid.Blazor

Grid component with CRUD for Blazor (client-side and server-side) and ASP.NET Core MVC
GNU Lesser General Public License v2.1
698 stars 135 forks source link

MVCGridCore Scrollable #295

Open ManishVadukul opened 3 years ago

ManishVadukul commented 3 years ago

Hi I am creating customer grid using below code. Code works fine.

I have also used css for scroll bar which is below. But output isn't great. Please could you help me with right code. Header not great. / Grid Scroll --------------------------------- / thead, tbody { display: block; }

tbody { height: 400px; overflow-y: auto; overflow-x: hidden; }

Please see screenshot GridMVCCore 3 0_scroll_issue

gustavnavar commented 3 years ago

Have you tried to use the SetTableLayout method to configure grid dimensions?

The documentation is here: https://github.com/gustavnavar/Grid.Blazor/blob/master/docs/dotnetcore/Grid_dimensions.md

And there is a sample here: https://github.com/gustavnavar/Grid.Blazor/blob/master/GridMvc.Demo/Pages/GridPage.cshtml.cs

ManishVadukul commented 3 years ago

I tried in this grid . You can see in code. but there is error Error : CS0103 The name 'TableLayout' does not exist in the current context See below GRID

@await Html.Grid(Model).Named("customerGrid").Columns(columns => { columns.Add(c => c.Firstname).Sortable(true); columns.Add(c => c.Lastname).Sortable(true); columns.Add(c => c.Phone).Sortable(true); columns.Add(c => c.Email).Sortable(true); columns.Add(c => c.Billingaddress).Sortable(true); columns.Add(c => c.Deliveryaddress).Sortable(true);

columns.Add().Titled("Edit") .Encoded(false) .Sanitized(false) .SetWidth(30) .RenderValueAs(o => @<a onclick="showInPopup('@Url.Action("Upsert", "Customer", new { id = o.CustomerId }, Context.Request.Scheme)','New Customer')">);

columns.Add().Titled("Delete") .Encoded(false) .Sanitized(false) .SetWidth(30) .RenderValueAs(o => @

);

}).WithPaging(100).Sortable().SetTableLayout(TableLayout.Fixed, "1800px", "400px").RenderAsync()