htmlやjavascriptが初心者で大変申し訳なく、かつ連投で大変恐縮なのですがご教示ください。
ASP.NETを用いてWebアプリケーションを作成しております。
以下のコードを実行してテーブル初期値を表示することはできているのですが、
データ変更や追加を、ページをリロードせずに実現するにはどのような方法がありますでしょうか。
テーブルのみの更新にはAjaxを使用するとStackOverflow等で見つけてはいるのですが、
リストで受け取るJson形式のデータをどうHtmlに反映させるかが分かりません。
C#
1public class StudentController{ 2 public IActionResult Index(){ 3 return View(studentList) 4 } 5 6 public JsonResult GetStudentInfo(){ 7 return Json(studentList) 8 } 9}
html
1<div class="row"> 2 <div class="col-md-12"> 3 <table id="tbl_students" class="table"> 4 <thead> 5 <tr> 6 <th> 7 @Html.DisplayNameFor(model => model.Name) 8 </th> 9 <th> 10 @Html.DisplayNameFor(model => model.Age) 11 </th> 12 </tr> 13 </thead> 14 <tbody> 15 @foreach (var item in Model) 16 { 17 <tr> 18 <td> 19 @Html.DisplayFor(modelItem => item.Name) 20 </td> 21 <td> 22 @Html.DisplayFor(modelItem => item.Age) 23 </td> 24 </tr> 25 } 26 </tbody> 27 </table> 28 </div> 29</div>
以下のようなコードを足せばよい(???)と思っているのですが、詰まってしまっています。
javascript
1$.ajax({ 2 url: '/Student/GetStudentInfo', 3 method: get, 4 data:, 5 success: function (response) { 6 $('tbl_students').html(response); body 7 } 8 });