Home > MVC > How to use grid in MVC using GridMvc

How to use grid in MVC using GridMvc

In this article, we have described with an example code, how to use a grid in MVC using GridMvc.

In this article, we have described with an example code, how to use a grid in MVC using GridMvc.

This is a very useful control in MVC. we can use this for easily filtering, sorting and paging of data in gridmvc and automatically bind to and display the data from a model.


Required Namespace:

You will need to use the following namespaces.

using System.Configuration;

using System.Data.SqlClient;



We have used the gridmvc code below. You can have a look at it and learn.

@model IEnumerable<Html_Grid_MVC.Models.Customers>


    ViewBag.Title = "How to use grid in mvc using GridMvc";


@using GridMvc.Html


<script src="~/Scripts/jquery-1.10.2.js"></script>

<link href="@Url.Content("~/Content/Gridmvc.css")" rel="stylesheet" />

<script src="@Url.Content("~/Scripts/gridmvc.min.js")"></script>

<script src="~/bootstrap/js/bootstrap.min.js"></script>

<link href="~/bootstrap/css/bootstrap.min.css" rel="stylesheet" />

<link href="~/Content/Site.css" rel="stylesheet" />

<div class="container">

    <div style="margin-top: 10px"></div>

    <div class="logo col-sm-12 text-center col-md-12 ">


    <div class="clearfix"></div>


        <legend class="legend">All Customers Detail</legend>

        <div style="margin-top: 5px"></div>

        <div class="test" style="overflow: scroll; height: 500px; width: 1000px">

            <div style="width: 1000px">

                <div class="panel">

                    <div class="panel-body">

                        @Html.Grid(Model).Columns(columns =>


                        columns.Add(c => c.customerID).Titled("CustomerID");

                        columns.Add(c => c.FirstName).Titled("FirstName");

                        columns.Add(c => c.LastName).Titled("LastName");

                        columns.Add(c => c.CreatedDate).Titled("CreatedDate").Format("{0:dd/MM/yyyy}");

                        columns.Add(c => c.Address).Titled("Address");









Model C#

we have provided model code below.

public class Customers


        public int customerID { get; set; }

        public string FirstName { get; set; }

        public string LastName { get; set; }

        public string Address { get; set; }

        public DateTime CreatedDate { get; set; }



Controller C#

public ActionResult Index()


            List<Customers> customers = PopulateCustomers();

            return View(customers);




        private List<Customers> PopulateCustomers()



            List<Customers> customers = new List<Customers>();

            string constr = Convert.ToString(ConfigurationManager.ConnectionStrings["Connection"]);

            SqlConnection con = new SqlConnection(constr);

            SqlCommand cmd = new SqlCommand("Select * from dim_Customer_Master", con);


            SqlDataReader idr = cmd.ExecuteReader();

            if (idr.HasRows)


                while (idr.Read())


                    customers.Add(new Customers


                        customerID = Convert.ToInt32(idr["Customer_id"]),

                        FirstName = Convert.ToString(idr["FirstName"]),

                        LastName = Convert.ToString(idr["lastname"]),

                        CreatedDate = Convert.ToDateTime(idr["createddate"]),

                        Address = Convert.ToString(idr["Address"])





            return customers;




How to use grid in MVC using GridMvc



Note: All contents are copyright of their authors.


Leave a Reply

Email ID:*