Get Data in MVC

Add below action in page

  1. public ActionResult GetDetails()  
  2.  
  3.  {  
  4.      var data = DB.tblStuds.ToList();  
  5.       return PartialView(data);  
  6. }  

Add partial view for this action. RightClick on above Action > add View > Enter ViewName Same as action name > tick Create Partial View


Now we have index.cshtml where we have Show Data Button for which I have ajax call for getting stud details.

Index.cshtml

  1. @model projStudentInfo.Models.tblStud  
  2.   
  3. @ {  
  4.   
  5.     ViewBag.Title = "Index";  
  6.   
  7.     Layout = "~/Views/Shared/_Layout.cshtml";  
  8. }  
  9.   
  10. < h2 >  
  11.   
  12. Student Info < /h2>  
  13.   
  14. @using (Html.BeginForm("Save""Studs", FormMethod.Post))  
  15.   
  16. {  
  17.   
  18. <table>  
  19.   
  20. <tr>  
  21.   
  22. <td>  
  23.   
  24. Name  
  25.   
  26. </td >  
  27.   
  28. < td > @Html.TextBoxFor(c = > c.stud_name)  
  29.   
  30. < /td>  
  31.   
  32. </tr >  
  33.   
  34. < tr >  
  35.   
  36. < td >  
  37.   
  38. Age  
  39.   
  40. < /td>  
  41.   
  42. <td>@Html.TextBoxFor(c => c.stud_age)  
  43.   
  44. </td >  
  45.   
  46. < /tr>  
  47.   
  48. <tr>  
  49.   
  50. <td>  
  51.   
  52. <input type="submit" name="submit" value="Save" / >  
  53.   
  54. < /td>  
  55.   
  56. <td>  
  57.   
  58. <input type="button" name="submit" value="Show Data" id="btnShow" / >  
  59.   
  60. < /td>  
  61.   
  62. </tr >  
  63.   
  64. < /table>  
  65.   
  66. }  
  67.   
  68. <div id="dvShow"></div >  
  69.   
  70. < script >  
  71.   
  72. /* we have ajax call for calling GetDetails which will return html data in vHtml variable */  
  73.   
  74. $(document).ready(function() {  
  75.   
  76.     $("#btnShow").click(function() {  
  77.   
  78.         $.ajax({  
  79.   
  80.             url: '@Url.Action("GetDetails","Studs")',  
  81.   
  82.             type: 'post',  
  83.   
  84.             success: function(vHtml) {  
  85.   
  86.                 $("#dvShow").html("");  
  87.   
  88.                 $("#dvShow").html(vHtml);  
  89.             }  
  90.   
  91.         });  
  92.   
  93.     });  
  94.   
  95. });  
  96.   
  97. < /script>  
  98.   
  99. GetDetails.cshtml (partialview)  
  100.   
  101. @model IEnumerable<projStudentInfo.Models.tblStud>  
  102.   
  103. <table border="0" cellpadding="0" cellspacing="0" id="tblStud">  
  104.   
  105. <thead>  
  106.   
  107. <tr>  
  108.   
  109. <th>  
  110.   
  111. Id  
  112.   
  113. </th >  
  114.   
  115. < th >  
  116.   
  117. Student Name  
  118.   
  119. < /th>  
  120.   
  121. <th>  
  122.   
  123. Age  
  124.   
  125. </th >  
  126.   
  127. < /tr>  
  128.   
  129. </thead >  
  130.   
  131. @foreach(var item in Model)  
  132.   
  133. {  
  134.   
  135.     < tr >  
  136.   
  137.     < td > @item.studid  
  138.   
  139.     < /td>  
  140.   
  141. <td>@item.stud_name  
  142.   
  143. </td >  
  144.   
  145.     < td > @item.stud_age  
  146.   
  147.     < /td>  
  148.   
  149. </tr >  
  150.   
  151. }  
  152.   
  153. < /table>  
  154.   
  155. <style>  
  156.  
  157. #tblStud td {padding:5px;}  
  158.  
  159. #tblStud th {background:#aea;}  
  160.   
  161. </style >  

Final Screen