While writing codes and fetching data we bring data or the list of data into the grid which is also in the table form .

For doing that our first approach is to make the code written and return list from it.

EmployeeRepository EmpRepObj = null;

        public ActionResult Index()
        {
            EmpRepObj = new EmployeeRepository();
            List<EmployeeModel> EmpMod = new List<EmployeeModel>();
            EmpMod = EmpRepObj.GetDetails().ToList();
            return View(EmpMod);
        }

 public List<EmployeeModel> GetDetails()
        {
            List<EmployeeModel> EmployeeLst = new List<EmployeeModel>();
            try
            {
                SqlDataReader reader = null;
                using (SqlConnection sqlConnection = new SqlConnection(strConnString))
                {
                    if (sqlConnection.State == ConnectionState.Closed)
                    {
                        sqlConnection.Open();
                    }
                    reader = SqlHelper.ExecuteReader(sqlConnection, CommandType.StoredProcedure, "uspGetUsers");
                    if (reader.HasRows)
                    {
                        while (reader.Read())
                        {
                            EmployeeLst.Add(new EmployeeModel
                            {
                                EmpId = reader["EmpId"] != null ? !string.IsNullOrEmpty(Convert.ToString(reader["EmpId"])) ? Convert.ToInt32(Convert.ToString(reader["EmpId"]).Trim()) : 0 : 0,
                                FirstName = reader["EmpFirstName"] != null ? Convert.ToString(reader["EmpFirstName"]) : String.Empty,
                                MiddleName = reader["EmpMiddleName"] != null ? Convert.ToString(reader["EmpMiddleName"]) : String.Empty,
                                LastName = reader["EmpLastName"] != null ? Convert.ToString(reader["EmpLastName"]) : String.Empty,
                                PhoneNo = reader["EmpPhoneNo"] != null ? Convert.ToString(reader["EmpPhoneNo"]) : String.Empty,
                                Address = reader["EmpAddress"] != null ? Convert.ToString(reader["EmpAddress"]) : String.Empty,
                                Status = getstatus.success
                            });
                        }
                    }
                }
            }
            catch (Exception ex)
            {
                EmployeeLst.Add(new EmployeeModel
                {
                    msg = ex.Message,
                    Status = getstatus.failure
                });
            }
            return EmployeeLst;
        }

    }

Then after that we will bind it with the view for that the action is being coded. So the data will be returned in the list format and also binded in the list format.

@model IEnumerable<MVC_Demo.Models.EmployeeModel>

@{
    ViewBag.Title = "Index";
}
@{ var i = 1;}
@using (Html.BeginForm("RegisterEmployeeDetails", "Register", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
    @Html.AntiForgeryToken()

<h2>Index</h2>




<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.EmpId)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.FirstName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.MiddleName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.LastName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.PhoneNo)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Address)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.msg)
        </th>
        <th></th>
    </tr>
   
@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.EmpId,new { id="lbl"+i})
            @Html.TextBoxFor(modelItem => item.EmpId,"", new {id="txt"+i,style="display:none;"})
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.FirstName, new { id = "lbl"+i })
            @Html.TextBoxFor(modelItem => item.FirstName,"", new { id = "txt"+i, style = "display:none;" })
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.MiddleName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.LastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.PhoneNo)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Address)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.msg)
        </td>
        <td>
            <a href="javascript:void(0);" id=i  onclick="Edit(this);">Edit</a>
    
            @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
        </td>
    </tr>
    i = i + 1;
}

</table>

}


<script>
    function Edit(i)
    {
        var a = i.id;
        $("#lbl" + a).hide();
        $("#txt" + a).show();
    }
</script>

It is nothing but simply the table that contains the columns that needs to be binded in the form of the list.