Reputation: 781
My Ajax block looks like so:
$('#btnTest').click(function(){
$.getJSON('/User/ViewMessages',function(result) {
// TODO: update the DOM with the items
$("table#tblMessages").append("<tr><td>"+result.MESSAGETEXT+"</td><td>"+result.DATESENT+"</td>");
});
});
My Action in my Controller looks like such:
public ActionResult ViewMessages()
{
var recipient = Convert.ToInt32(HttpContext.Session["User_Id"]);
var query = (from m in context.Messages
from rec in context.Recipients
where rec.RECIPIENT == recipient
where rec.MESSAGEID == m.MESSAGEID
select new
{
m.MESSAGETEXT,
m.DATESENT
}).ToList();
return Json(query.ToList());
}
When Debugging, my query variable returns: { MESSAGETEXT = "seresr", DATESENT = {9/15/2011 11:06:45 AM} }
The thing is, my table is added with "undefined" for both my values. Where have i gone wrong? I have already added the maproute as well, but I'm still out of luck.
Upvotes: 0
Views: 191
Reputation: 41902
It looks like you're returning a list, which will be represented in JSON as an array. So your result
object is a JavaScript array rather than a single object. To loop through all the items and add a table row for each, try something like this:
$.getJSON('/User/ViewMessages', function(result) {
for (var i in result) {
var row = result[i];
$("table#tblMessages").append("<tr><td>" + row.MESSAGETEXT
+ "</td><td>" + row.DATESENT + "</td>");
}
});
Upvotes: 1