MVC Json verisini Getirme

Bu yazımda jquery kullanarak json verisini yazdıracağım..

using System.Collections.Generic;
using System.Web.Mvc;

namespace Ana.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public JsonResult GetJsonData()
        {
            var elemanlar = new List<Person>
                {
                    new Person{Id = 1, FirstName = "Erkan", LastName = "Yürek", 
                        Addresses = new List<Address>
                                        {
                                            new Address{Line1 = "Erkan ın Ev adresi"},
                                            new Address{Line1 = "Erkan iş  Adresi"}
                                        }},
                    new Person{Id = 1, FirstName = "Cemil", LastName = "Polat", 
                        Addresses = new List<Address>
                                        {
                                            new Address{Line1 = "Cemil ın Ev adresi"},
                                            new Address{Line1 = "Cemil iş  Adresi"},
                                            new Address{Line1 = "Cemil ikinci  Adresi"}
                                        }},
                                                                                                        
                    new Person{Id = 2, FirstName = "Nisa", LastName = "Yürek", 
                        Addresses = new List<Address>
                                        {
                                            new Address{Line1 = "Nisanın Ev adresi"},
                                            new Address{Line1 = "Nisanın İş Adresi"}
                                        }}};

            return Json(elemanlar, JsonRequestBehavior.AllowGet);
        }
    }

    public class Person
    {
        public int Id { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }

        public List<Address> Addresses { get; set; }
    }

    public class Address
    {
        public string Line1 { get; set; }
        public string Line2 { get; set; }
    }
}

Şimdide client tarafında html kodu yazılım. Ben MVC projesi olarak hazırlamıştım. Section bölümleri Layout da tanımlanmış alanlardır.

@{
    ViewBag.Title = "Home Page";
}
@section featured {
<input id="btnGetir" type="button" value="Get Persons" />
<div>
    <div id="ajaxDiv">
    </div>
</div>

}
@section Scripts {
<script type="text/javascript">
    $(document).ready(function () {
        $('#btnGetir').click(function () {
            $.getJSON("/Home/GetJsonData", null, function (data) {
                var div = $('#ajaxDiv');
                div.html("<br/> " + "Persons received from server: " + "<br/>");
                $.each(data, function (i, item) {
                    div.append("<br/>" + "Ad: "+ item.FirstName+ ", Soyad: " + item.LastName);
                    $.each(item.Addresses, function (i, addres) {
                        div.append("<br/>" +"   " +(i+1) + ". adres: " + addres.Line1);
                    });
                });
            });
        });
    });

</script>
}

Bir sonraki makalemizde görüşmek üzere..