<\/div>\n

Yap\u0131sal olarak XML diline benzeyen, veri ta\u015f\u0131mak i\u00e7in olu\u015fturulmu\u015f standart bir Object JavaScript dilidir.JSON(JavaScript Object Notation<\/strong><\/em>), JavaScript i\u00e7erisinde kolayca i\u015flenebilme \u00f6zelli\u011fine sahiptir.Bu \u00f6zelli\u011fi y\u00fcz\u00fcnden genellikle Ajax platformunda tercih edilmektedir.JSON ile d\u00fczenlenen bir veri yap\u0131s\u0131na JavaScript komutlar\u0131yla \u00e7ok h\u0131zl\u0131 ve esnek bir \u015fekilde eri\u015filebilmektedir.Yap\u0131sal olarak her ne kadar XML diline benzesede, XML’e g\u00f6re daha h\u0131zl\u0131 parse edilmekte ve fiziksel boyut olarakta az yer kaplamaktad\u0131r.Bunun nedeni ise, JSON’da XML’de oldu\u011fu gibi “node” a\u00e7\u0131p kapatmayla u\u011fra\u015f\u0131lmamakta, onun yerine sat\u0131rlar ve elementler birbirlerinden noktalama i\u015faretleri ve parantezler ile ayr\u0131lmaktad\u0131rlar.\u015eimdi gelin beraber Asp.NET MVC yap\u0131s\u0131yla JSON mimarisini birlikte daha detayl\u0131 inceleyelim.
\n<\/p>\n

\u00d6ncelikle JSON yap\u0131s\u0131nda kullan\u0131lan veri tiplerini g\u00f6relim.
\n“string<\/strong><\/span>“, “number<\/strong><\/span>“, “bool<\/strong><\/span>“, “array<\/span><\/strong>“, “object<\/strong><\/span>” ve “null<\/span><\/strong>”<\/p>\n

\u015eimdi hemen bir Asp.NET MVC projesinde \u00f6rneklendirme yapal\u0131m.<\/p>\n

\r\n        public ActionResult Index()\r\n        {\r\n            return View();\r\n        }\r\n\r\n        public JsonResult OgrencileriGetir()\r\n        {\r\n            List<ListItem> Liste = new List<ListItem>() {\r\n            new ListItem{ Value = "1" , Text = "Ahmet"},\r\n            new ListItem{ Value = "2" , Text = "Mehmet"},\r\n            new ListItem{ Value = "3" , Text = "Ali"},\r\n            new ListItem{ Value = "4" , Text = "Ay\u015fe"},\r\n            new ListItem{ Value = "5" , Text = "Gen\u00e7ay"},\r\n            };\r\n\r\n            return Json(Liste, JsonRequestBehavior.AllowGet);\r\n        }\r\n<\/pre>\nYukar\u0131daki kod blo\u011funu incelersek e\u011fer, “JsonResult” tipinden “OgrencileriGetir” isimli metodumuzda bir \u00f6\u011frenci bilgisini tutan liste mevcut ve metodumuz bu listeyi JSON yap\u0131s\u0131nda d\u00f6nd\u00fcrmektedir.<\/p>\n
\u015eimdi bu listeyi “Index” isimli Action metodumuzun View katman\u0131ndan \u00e7ekece\u011fiz.<\/p>\n
\r\n<script type="text\/javascript">\/\/ <![CDATA[\r\n    $(function () {\r\n        $('#btnOgrencileriGetir').click(function () {\r\n            $.getJSON("\/Home\/OgrencileriGetir", null, function (data) {\r\n                jQuery.each(data, function (i, eleman) {\r\n                    $("#OgrenciListesi").append(eleman.Value + " " + eleman.Text + "<br>\r\n");\r\n                });\r\n            });\r\n        });\r\n    });\r\n<\/script>\r\n\r\n<input id="btnOgrencileriGetir" type="button" value="\u00d6\u011frencileri Getir" \/>\r\n<div id="OgrenciListesi"><\/div>\r\n<\/pre>\nYukar\u0131daki kod blo\u011funu incelerseniz e\u011fer, “btnOgrencileriGetir” isimli butona t\u0131kland\u0131\u011f\u0131 zaman tetiklenecek JavaScript kodunu yaz\u0131yoruz.”getJSON” metodu ile JSON verisini al\u0131yoruz.Birinci parametreye JSON d\u00f6nd\u00fcren metodumuzu, ikinci parametreye ise bu metoda g\u00f6nderece\u011fimiz parametreyi yaz\u0131yoruz.”function (data)<\/span><\/em>” metodu ile JSON verimiz “data” isimli parametreye y\u00fckleniyor.”jQuery.each<\/span><\/em>” metodu C#’ta ki “foreach” d\u00f6ng\u00fcs\u00fcne benzer niteliktedir ve bu metod sayesinde liste halinde gelen verimizi ayr\u0131\u015ft\u0131r\u0131p gerekli alana yans\u0131t\u0131yoruz.<\/p>\n
Bu i\u015flemin ekran g\u00f6r\u00fcnt\u00fcs\u00fc a\u015fa\u011f\u0131daki gibi olacakt\u0131r.
\n<\/a><\/p>\n
Buraya kadar Server’dan JSON format\u0131nda nas\u0131l veri al\u0131nd\u0131\u011f\u0131n\u0131 g\u00f6rd\u00fck.\u015eimdide Server’a JSON format\u0131nda veri g\u00f6ndermeyi inceleyelim.<\/p>\n
Bu \u00f6rneklendirmeyi bir model \u00fczerinden ger\u00e7ekle\u015ftirece\u011fimiz i\u00e7in \u00f6ncelike “Ogrenci” isminde bir model tan\u0131ml\u0131yorum.<\/p>\n
\r\n    public class Ogrenci\r\n    {\r\n        public int OgrenciNo { get; set; }\r\n        public string Adi { get; set; }\r\n        public string SoyAdi { get; set; }\r\n    }\r\n<\/pre>\n\u015eimdi bu modeli POST edebilecek yap\u0131da bir View sayfas\u0131 tasarlayal\u0131m.(\u00d6rnek olarak “Home(Controller).cs” isimli Controller sayfas\u0131n\u0131n “Index” Action metodunun .cshtml uzant\u0131l\u0131 dosyas\u0131nda<\/span>)<\/p>\n\r\n<div>@Html.TextBox("OgrenciNo")<\/div>\r\n<div>@Html.TextBox("Adi")<\/div>\r\n<div>@Html.TextBox("SoyAdi")<\/div>\r\n<div><input id="btnGonder" type="submit" value="Ogrenciyi JSON Olarak G\u00f6nder" \/><\/div>\r\n<\/pre>\n\u015eimdi ise olu\u015fturdu\u011fumuz bu formdaki bilgileri Server’a JSON tabanl\u0131 POST edecek JQuery kodlar\u0131m\u0131z\u0131 yazal\u0131m.<\/p>\n\r\n<script type="text\/javascript">\r\n    $('#btnGonder').click(function () {\r\n        var Ogrenci = {\r\n            OgrenciNo: $('#OgrenciNo').val(),\r\n            Adi: $('#Adi').val(),\r\n            SoyAdi: $('#SoyAdi').val()\r\n        };\r\n        $.ajax({\r\n            url: '\/Home\/GelenOgrenci',\r\n            type: 'POST',\r\n            data: JSON.stringify(Ogrenci),\r\n            dataType: 'json',\r\n            contentType: 'application\/json; charset=utf-8'\r\n        });\r\n        return false;\r\n    });\r\n<\/script>\r\n<\/pre>\nYukar\u0131daki kod blo\u011funu incelersek e\u011fer, “btnGonder” isimli butonumuz tetiklendi\u011fi an “Home(Controller).cs” isimli Controller s\u0131n\u0131f\u0131ndaki “GelenOgrenci” isimli metodun \u00e7al\u0131\u015faca\u011f\u0131 bildirilmi\u015ftir.”data” parametresi ile JSON format\u0131nda olu\u015fturulan “Ogrenci” isimli nesnemiz Server’a g\u00f6nderilecektir.<\/p>\n
\u015eimdide son olarak “Home(Controller).cs” Controller s\u0131n\u0131f\u0131m\u0131zdaki “GelenOgrenci” metodunu olu\u015ftural\u0131m.<\/p>\n\r\n    public class HomeController : Controller\r\n    {\r\n        public ActionResult Index()\r\n        {\r\n            return View();\r\n        }\r\n        public ActionResult GelenOgrenci(Ogrenci ogrenci)\r\n        {\r\n            return View();\r\n        }\r\n    }\r\n<\/pre>\nProjemizi “GelenOgrenci” metoduna Break – Point koyarak, bu \u015fekilde derleyip \u00e7al\u0131\u015ft\u0131rd\u0131\u011f\u0131m\u0131z zaman a\u015fa\u011f\u0131daki ekran g\u00f6r\u00fcnt\u00fcs\u00fcyle kar\u015f\u0131la\u015faca\u011f\u0131z.
\n<\/a><\/p>\n
Son olarak dikkat etmemiz gereken bir hususa de\u011finmek gerekirse, JQuery k\u00fct\u00fcphanesindeki “JSON.stringify()” metodu IE9 ve \u00fczeri browserlarda desteklenmektedir.<\/p>\n
Sonraki yaz\u0131lar\u0131mda g\u00f6r\u00fc\u015fmek \u00fcmidiyle..
\nFaydalanman\u0131z dile\u011fiyle..
\n\u0130yi \u00e7al\u0131\u015fmalar..<\/p>\n","protected":false},"excerpt":{"rendered":"
Yap\u0131sal olarak XML diline benzeyen, veri ta\u015f\u0131mak i\u00e7in olu\u015fturulmu\u015f standart bir Object JavaScript dilidir.JSON(JavaScript Object Notation), JavaScript i\u00e7erisinde kolayca i\u015flenebilme \u00f6zelli\u011fine sahiptir.Bu \u00f6zelli\u011fi y\u00fcz\u00fcnden genellikle Ajax platformunda tercih edilmektedir.JSON ile d\u00fczenlenen bir veri yap\u0131s\u0131na...<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11,780,345],"tags":[744,746,748,530,283],"class_list":["post-2344","post","type-post","status-publish","format-standard","hentry","category-asp-net-mvc","category-json","category-mvc-4-0","tag-ajax","tag-asp-net-mvc","tag-jquery","tag-json","tag-mvc"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/2344","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/comments?post=2344"}],"version-history":[{"count":0,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/2344\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media?parent=2344"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/categories?post=2344"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/tags?post=2344"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}