Generate HyperLink Using ActionLink in Asp.net Mvc

CONTROLLER CODE:


 public ActionResult Index()
        {
            StudentContext stuContext = new StudentContext();
            List<Student> student = stuContext.Students.ToList();
            return View(student);
        }
        public ActionResult Details(int Id)
        {
            StudentContext stuContext = new StudentContext();
            Student student = stuContext.Students.Single(stu => stu.Id== Id);
            return View(student);
        }




In this case we have two views, IndexPage View and DetailPage View:



INDEX VIEW CODE:

@model IEnumerable<GenerateHyperlinkUseActionlink.Models.Student>


@using GenerateHyperlinkUseActionlink.Models
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<ul>
    @foreach (Student student in @Model)
    {
        <li>@Html.ActionLink(student.StudentName,"Details",new { Id = student.Id })
    </li>
    }

</ul>

INDEX VIEW CODE:

@model GenerateHyperlinkUseActionlink.Models.Student
@{
    ViewBag.Title = "Details";
}


<table class="table-responsive">
    <tr>
        <td><b>Student Id</b></td>
        <td>@Model.StudentId</td>
     
    </tr>

    <tr>
        <td>
            <b>Student Name</b>
        </td>
        <td>
            @Model.StudentName
        </td>
    </tr>



    <tr>
        <td>
            <b>Gender</b>
        </td>

        <td>
            @Model.Gender
        </td>
    </tr>
</table>



I used ado.net entity data framework so my model is:

public partial class Student
    {
        public int Id { get; set; }
        public Nullable<int> StudentId { get; set; }
        public string StudentName { get; set; }
        public string Gender { get; set; }
    }

FINAL OUTPUT: