Create a new MVC 4 Application, given below-





Create a table, using the script, given below (if needed,as table will be generated on code first)-

  1. CREATE TABLE [dbo].[StudentDetails] (
  2. [Id] INT IDENTITY (1, 1) NOT NULL,
  3. [StudentName] NVARCHAR (MAX) NULL,
  4. [Age] INT NULL,
  5. CONSTRAINT [PK_dbo.StudentDetails] PRIMARY KEY CLUSTERED ([Id] ASC)
  6. );
Add Connection string in Web.config, as given below-
  1. <connectionStrings>
  2. <add name="DefaultConnection" connectionString="Data Source=(LocalDb)\v11.0;Initial Catalog=aspnet-BootstrapApp-20160910224720;Integrated Security=SSPI;AttachDBFilename=|DataDirectory|\aspnet-BootstrapApp-20160910224720.mdf" providerName="System.Data.SqlClient" />
  3. </connectionStrings>
Add StudentDetails.cs and DataContext class file in Model, as given below-
  1. public class StudentDetails
  2. {
  3. public int Id { get; set; }
  4. public string StudentName { get; set; }
  5. public int? Age { get; set; }
  6. }
  7. public class UsersContext : DbContext
  8. {
  9. public UsersContext()
  10. : base("DefaultConnection")
  11. {
  12. }
  14. public DbSet<StudentDetails> studentDbset { get; set; }
  15. }
Add StudentController.cs with the codes, given below-
  1. public class StudentController : Controller
  2. {
  3. private UsersContext db = new UsersContext();
  5. //
  6. // GET: /Student/Student/
  8. public ActionResult Index()
  9. {
  10. return View(db.studentDbset.ToList());
  11. }
  13. public ActionResult Index1()
  14. {
  15. return View(db.studentDbset.ToList());
  16. }
  18. //
  19. // GET: /Student/Student/Details/5
  21. public ActionResult Details(int id = 0)
  22. {
  23. StudentDetails studentdetails = db.studentDbset.Find(id);
  24. if (studentdetails == null)
  25. {
  26. return HttpNotFound();
  27. }
  28. return View(studentdetails);
  29. }
  31. //
  32. // GET: /Student/Student/Create
  33. [HttpGet]
  34. public ActionResult Create()
  35. {
  36. return View();
  37. }
  39. //
  40. // GET: /Student/Student/Create
  42. public ActionResult CreateForm()
  43. {
  44. return View();
  45. }
  47. //
  48. // POST: /Student/Student/Create
  50. [HttpPost]
  51. public ActionResult Create(StudentDetails studentdetails)
  52. {
  53. if (ModelState.IsValid)
  54. {
  55. db.studentDbset.Add(studentdetails);
  56. db.SaveChanges();
  57. return RedirectToAction("Index");
  58. }
  60. return View(studentdetails);
  61. }
  63. //
  64. // GET: /Student/Student/Edit/5
  66. public ActionResult Edit(int id = 0)
  67. {
  68. StudentDetails studentdetails = db.studentDbset.Find(id);
  69. if (studentdetails == null)
  70. {
  71. return HttpNotFound();
  72. }
  73. return View(studentdetails);
  74. }
  76. public ActionResult EditForm(int id = 0)
  77. {
  78. StudentDetails studentdetails = db.studentDbset.Find(id);
  79. if (studentdetails == null)
  80. {
  81. return HttpNotFound();
  82. }
  83. return View(studentdetails);
  84. }
  87. //
  88. // POST: /Student/Student/Edit/5
  90. [HttpPost]
  91. public ActionResult Edit(StudentDetails studentdetails)
  92. {
  93. if (ModelState.IsValid)
  94. {
  95. db.Entry(studentdetails).State = EntityState.Modified;
  96. db.SaveChanges();
  97. return RedirectToAction("Index");
  98. }
  99. return View(studentdetails);
  100. }
  102. //
  103. // GET: /Student/Student/Delete/5
  105. public ActionResult Delete(int id = 0)
  106. {
  107. StudentDetails studentdetails = db.studentDbset.Find(id);
  108. if (studentdetails == null)
  109. {
  110. return HttpNotFound();
  111. }
  112. return View(studentdetails);
  113. }
  115. //
  116. // POST: /Student/Student/Delete/5
  118. [HttpPost, ActionName("Delete")]
  119. public ActionResult DeleteConfirmed(int id)
  120. {
  121. StudentDetails studentdetails = db.studentDbset.Find(id);
  122. db.studentDbset.Remove(studentdetails);
  123. db.SaveChanges();
  124. return RedirectToAction("Index");
  125. }
  127. protected override void Dispose(bool disposing)
  128. {
  129. db.Dispose();
  130. base.Dispose(disposing);
  131. }
  132. }
Put the script, given below, in _Layouts.cshtml-
  1. <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  2. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  3. <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


Screen clipping is taken: 11-09-2016 00:01

Add Index.cshtml View in Student Folder and add the snippet, given below-
  1. @model IEnumerable<BootstrapApp.Models.StudentDetails>
  3. @{
  4. ViewBag.Title = "Index";
  5. }
  7. <h2>Index</h2>
  8. <div class="container-fluid">
  9. <h1>Small Grid</h1>
  10. <p>The following example will result in a 25%/75% split on small, medium and large devices. On extra small devices, it will stack (100% width).</p>
  11. <p>Resize the browser window to see the effect.</p>
  12. <div class="row">
  13. <div class="col-sm-3">
  14. <label for="StudentName">Student name</label>
  15. </div>
  16. <div class="col-sm-9">
  17. <label for="Age">Age</label>
  18. </div>
  19. </div>
  20. @foreach (var item in Model) {
  21. <div class="row">
  22. <div class="col-sm-3">
  23. <label for="StudentName">@item.StudentName</label>
  24. </div>
  25. <div class="col-sm-3">
  26. <label for="Age">@item.Age</label>
  27. </div>
  28. <div class="col-sm-3">
  29. <a href="/Student/Edit/@item.Id">Edit</a> |
  30. <a href="/Student/Details/@item.Id">Details</a> |
  31. <a href="/Student/Delete/@item.Id">Delete</a>
  32. </div>
  33. </div>
  34. }
  35. </div>
  36. <p>
  37. @Html.ActionLink("Create New", "Create")
  38. </p>
Add Create.cshtml and add the snippet, given below-
  1. @model BootstrapApp.Models.StudentDetails
  3. @{
  4. ViewBag.Title = "Edit";
  5. }
  7. <h2>Edit</h2>
  9. <div class="container">
  10. <h2>Form control: input</h2>
  11. <form action="/Student/Edit" method="post" novalidate="novalidate">
  12. <div class="form-group">
  13. <input id="Id" name="Id" type="hidden" value="@Model.Id">
  14. </div>
  15. <div class="form-group">
  16. <label for="Student Name">Student Name:</label>
  17. <input type="text" class="form-control" id="StudentName" name="StudentName" value="@Model.StudentName">
  18. </div>
  19. <div class="form-group">
  20. <label for="Age">Age:</label>
  21. <input class="form-control" id="Age" name="Age" type="number" value="@Model.Age">
  22. </div>
  23. <div class="form-group">
  24. <p>
  25. <input type="submit" value="Create" />
  26. </p>
  27. </div>
  28. </form>
  29. </div>
  30. s
  31. <div>
  32. @Html.ActionLink("Back to List", "Index")
  33. </div>
  35. @section Scripts {
  36. @Scripts.Render("~/bundles/jqueryval")
  37. }
The output is given below-



http://localhost:5474/Student

Screen clipping is taken: 11-09-2016 00:04



http://localhost:5474/Student/Create

Screen clipping is taken: 11-09-2016 00:04



http://localhost:5474/Student/Edit/1

Screen clipping is taken: 11-09-2016 00:05

Click here to download. (DB is attached with the solution).