Model
public class Users
{
public int UserId { get; set; }
public string UserName { get; set; }
}
Controller
public ActionResult Index()
{
return View();
}
public JsonResult GetUsers()
{
List<Users> users = new List<Users>()
{
new Users
{
UserId =1, UserName ="kaunain"
}};
return this.Json(users,JsonRequestBehavior.AllowGet);
}
View
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$.getJSON("/Home/GetUsers", null, function (data) {
$.each(data, function (index, users) {
$("p").text(users.UserName);
});
});
});
</script>
Updated view for multiple users
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$.getJSON("/Home/GetUsers", function (data) {
var items = [];
$.each(data, function (key, users) {
items.push('<li id="' + users.UserId + '">' + users.UserName + '</li>');
});
$('<ul/>', {
'class': 'Users-list',
html: items.join('')
}).appendTo('p');
});
});
</script>
Lastly specify Home/GetUsers route in global.asax.
No comments:
Post a Comment