User987 User987 - 1 month ago 15
ASP.NET (C#) Question

Update HTML page after jquery.click

I have an onclick function which basically just returns sorted data like following:

$(document).ready(function () {
$(".feedbackClick").click(function () {
$.post("/Analyze/GetSortedByFeedback")
.done(function (data) {
var sellers = $('<table />').append(data).find('#tableSellers').html();
$('#tableSellers').html(sellers);
});
});
});
});


And this is how the table looks like that I'm trying to update after the jquery post:

<table id="tableSellers" class="table table-striped jambo_table bulk_action">
<thead>
<tr class="headings">
<th class="column-title"><h4><i class="fa fa-user" style="text-align:center"></i> <span>Username</span></h4> </th>
<th class="column-title"> <h4><span class="glyphicon glyphicon-tasks salesClick" aria-hidden="true"></span></h4></th>
<th class="column-title"><h4><i class="fa fa-star feedbackClick"></i></h4></th>

</tr>
</thead>
<tbody>
@foreach (var item in ViewBag.rezultati)
{
<tr>
<td><a href="http://ebay.com/usr/@item.StoreName" target="_blank">@item.StoreName</a></td>
<td>
<b>
@item.SaleNumber
</b>
</td>
<td><b>@item.Feedback</b></td>
</tr>
}

</tbody>
</table>


The click would basically just fetch the results and update the table in HTMl...

Can someone help me out?

Edit:

This current method doesn't works... I trigger the event but nothing happens... The code in the Action is called properly, but the results aren't displayed...

Edit 2:

This is the content of the data object after .done:

System.Collections.Generic.List`1[WebApplication2.Controllers.ResultItem]


Edit 3:

This is the action:

public List<ResultItem> GetSortedByFeedback()
{
return lista.OrderByDescending(x => x.Feedback).ToList();
}


Edit4 this is the data after the Alexandru's post:

Array[100]


Now I can do:

data[0].Feedback


And this outputs in console:

61259

Answer

Please use this:

public JsonResult GetSortedByFeedback()
{
   var list=lista.OrderByDescending(x => x.Feedback).ToList();
   return Json(list);
}

If your method is GET please use this:

public JsonResult GetSortedByFeedback()
{
   var list=lista.OrderByDescending(x => x.Feedback).ToList();
   return Json(list,JsonRequestBehavior.AllowGet);
}

Then please use this:

 .done(function (data) {
      $('#tableSellers tbody').empty();
      $.each(data,function(i,item){
                  $('#tableSellers tbody').append('<tr><td><a href="http://ebay.com/usr/'+item.StoreName+'" target="_blank">'+item.StoreName+'</a></td><td><b>'+item.SaleNumber+'</b></td><td><b>'+item.Feedback+'</b></td></tr>');//append the row
      });
  });