Custom Razor View

To prepare to use your own View, follow these steps:

  1. Add the MVCGrid controller to your Routes
    routes.MapRoute(
        "MVCGrid",
        "mvcgrid/{action}",
        new { controller = "MVCGrid" },
        new[] { "MVCGrid.Web" }
    );
    
  2. Add a new Partial View to your project. Example: /Views/MVCGrid/_Custom.cshtml.
    Here is a partial view to get you started: _Grid.cshtml
  3. Everything you need to populate your table will be given to you in the RenderingModel object. @model MVCGrid.Models.RenderingModel
  4. On your grid definition or in the defaults, set RenderingMode = RenderingMode.Controller; and the ViewPath = "~/Views/MVCGrid/_Custom.cshtml";
  5. You must include the following line at the bottom of your view: @Html.Raw(Model.ClientDataTransferHtmlBlock)
Id First Name Last Name Status
370 Patrick Adams Inactive
493 Karen Adams Active
570 Nancy Adams Inactive
599 Eric Adams Inactive
635 Christine Adams Inactive
663 Bonnie Adams Inactive
778 Ronald Adams Inactive
820 Sean Adams Inactive
897 Judith Adams Active
857 Michael Alexander Active
652 Howard Alexander Inactive
339 Jerry Alexander Inactive
55 Susan Alexander Active
190 Amy Alexander Active
250 Nicholas Allen Active
472 Denise Allen Active
171 Jessica Alvarez Inactive
127 Janet Alvarez Inactive
661 Mildred Alvarez Inactive
855 Marie Alvarez Inactive
Showing 1 to 20 of 1000 entries


Code

Inside MVCGridConfig.cs
MVCGridDefinitionTable.Add("CustomRazorView", new MVCGridBuilder<Person>(colDefauls)
    .WithAuthorizationType(AuthorizationType.AllowAnonymous)
    .WithRenderingMode(RenderingMode.Controller)
    .WithViewPath("~/Views/MVCGrid/_Custom.cshtml")
    .AddColumns(cols =>
    {
        cols.Add("Id").WithSorting(false)
            .WithHtmlEncoding(false)
            .WithValueExpression((p, c) => c.UrlHelper.Action("detail", "demo", new { id = p.Id }))
            .WithValueTemplate("<a href='{Value}'>{Model.Id}</a>")
            .WithPlainTextValueExpression(p => p.Id.ToString());
        cols.Add("FirstName").WithHeaderText("First Name")
            .WithValueExpression(p => p.FirstName);
        cols.Add("LastName").WithHeaderText("Last Name")
            .WithValueExpression(p => p.LastName);
        cols.Add("Status").WithSortColumnData("Active")
            .WithHeaderText("Status")
            .WithValueExpression(p => p.Active ? "Active" : "Inactive");
    })
    .WithSorting(true, "LastName")
    .WithPaging(true, 20)
    .WithRetrieveDataMethod((context) =>
    {
        var options = context.QueryOptions;
        int totalRecords;
        var repo = DependencyResolver.Current.GetService<IPersonRepository>();
        string sortColumn = options.GetSortColumnData<string>();
        var items = repo.GetData(out totalRecords,
            options.GetLimitOffset(), options.GetLimitRowcount(),
            sortColumn, options.SortDirection == SortDirection.Dsc);
        return new QueryResult<Person>()
        {
            Items = items,
            TotalRecords = totalRecords
        };
    })
);
View
@Html.MVCGrid("CustomRazorView")