﻿
{"id":2216,"date":"2013-10-06T12:27:28","date_gmt":"2013-10-06T12:27:28","guid":{"rendered":"http:\/\/www.gencayyildiz.com\/blog\/?p=2216"},"modified":"2013-10-06T12:27:28","modified_gmt":"2013-10-06T12:27:28","slug":"asp-net-mvc-ajax","status":"publish","type":"post","link":"https:\/\/www.gencayyildiz.com\/blog\/asp-net-mvc-ajax\/","title":{"rendered":"Asp.NET MVC &#8211; Ajax"},"content":{"rendered":"<div id=\"fb-root\"><\/div>\n<p>Her ne kadar Asp.NET MVC mimarisinde Asp.NET Web Forms mimarisine k\u0131yasla Server yo\u011funlu\u011fu hafifletilmi\u015f olsada Client tabanl\u0131 algoritmalara zaman zaman ihtiya\u00e7 duyar\u0131z.G\u00fcn\u00fcm\u00fcz web sitelerinde her hangi bir tetiklenme an\u0131nda sistemin Server ile etkile\u015fimini ziyaret\u00e7ilere yans\u0131tmamak programc\u0131lar taraf\u0131ndan tercih edilmektedir.JQuery, JavaScript ve Ajax vb. gibi mimariler deste\u011fiyle siteler tasar\u0131msal a\u00e7\u0131dan dinamikle\u015ftirilip k\u0131smi zamanl\u0131 \u00e7al\u0131\u015fmalar tercih edilmektedir.Haliyle bu yaz\u0131m\u0131zda Asp.NET MVC ile Ajax konusunu ele al\u0131p irdeleyece\u011fiz.<br \/>\n<!--more--><br \/>\n\u00d6ncelikle &#8220;<em>Ajax nedir?<\/em>&#8221; sorusunun cevab\u0131n\u0131 verelim.<br \/>\n&#8220;Asynchronous JavaScript and XML&#8221; kelimelerinin ba\u015f harflerinden olu\u015fan, T\u00fcrk\u00e7e anlam\u0131 &#8220;E\u015f Zamans\u0131z Javascript ve XML&#8221; olan Client tabanl\u0131 bir programlama dilidir.<\/p>\n<p>Burada dikkatinizi \u00e7ekmek isterim.Client tabanl\u0131 diyoruz, yani web sayfalar\u0131nda JavaScript ve XMLHttpRequest ile etkile\u015fimli uygulamalar olu\u015fturmam\u0131z\u0131 sa\u011flayan bir teknoloji yap\u0131s\u0131ndan bahsediyoruz.<\/p>\n<p><em>Ajax ne i\u015fe yarar?<\/em><br \/>\nAsp.NET Web Forms mimarisinde herhangi bir buton ile belirli bir olay tetiklendi\u011fi anda sayfan\u0131n tamam\u0131 Server&#8217;a g\u00f6nderilir ve gerekli i\u015flemler yap\u0131ld\u0131ktan sonra sonu\u00e7 yeniden Client taraf\u0131na g\u00f6nderilir.Bildi\u011finiz gibi biz bu i\u015flemi <em>POST\/BACK<\/em> ad\u0131yla nitelendiriyoruz.Bu durumda, sayfan\u0131n hepsini kullanmasakta tamamen g\u00f6nderilmesi performans kayb\u0131na sebep olacakt\u0131r.Haliyle bu mant\u0131k Asp.NET MVC mimarisiyle a\u015f\u0131lm\u0131\u015f olsada ayn\u0131 durumdan MVC mimariside muzdariptir.\u00c7\u00fcnk\u00fc tetiklenme an\u0131nda gerekli Controller \u00e7al\u0131\u015ft\u0131r\u0131lsada b\u00fct\u00fcn sayfa POST edilmekte ve yeniden sonu\u00e7 y\u00fcklenmektedir.<\/p>\n<p>Ajax mimarisi ile sayfan\u0131n tamam\u0131n\u0131n Server&#8217;a g\u00f6nderilmesine gerek kalmadan belirli alanlarda de\u011fi\u015fiklikler ve g\u00fcncellemeler yap\u0131labilir.Bu asenkron bir yap\u0131da olaca\u011f\u0131ndan dolay\u0131 ziyaret\u00e7iler POST\/BACK olay\u0131n\u0131 g\u00f6rmeyeceklerdir.(<span style=\"font-size: x-small;\">Asp.NET MVC mimarisi POST\/BACK mant\u0131\u011f\u0131yla \u00e7al\u0131\u015fmamaktad\u0131r.Lakin her hangi bir Server i\u015flemi esnas\u0131nda sayfan\u0131n gidip gelmesini ba\u015fka bir isimle nitelendirmek pek benzer bir \u00f6rnek olmayaca\u011f\u0131ndan dolay\u0131 POST\/BACK ismini tercih etmekteyim.<\/span>)<\/p>\n<p><em>Peki Asp.NET MVC ile Ajax mimarisini nas\u0131l bir mant\u0131kla kullanabiliriz?<\/em><br \/>\nAsp.NET MVC mimarisinde, Ajax mimarisine \u00f6zel yap\u0131lar bulunmaktad\u0131r.Bu yap\u0131lar\u0131 kullanarak, View katman\u0131nda JavaScript ile Controller katman\u0131 i\u00e7erisinde belirtilen metodu tetikleyece\u011fiz ve geri d\u00f6nen veriyi istedi\u011fimiz alanda g\u00f6sterece\u011fiz.Temel mant\u0131k budur.<\/p>\n<p>Ajax mimarisinin \u00f6zel yap\u0131lar\u0131na &#8220;Html Helper&#8221; ve &#8220;JavaScript&#8221; k\u00fct\u00fcphanelerinden ula\u015fabiliriz.<\/p>\n<p>Yani anlayaca\u011f\u0131n\u0131z, Asp.NET MVC mimarisinde Server yap\u0131s\u0131 genellikle Controller katman\u0131ndan ibaret oldu\u011fu i\u00e7in herhangi bir Server i\u015fleminde sayfa yenilenmeden Controller katman\u0131yla asenkron yap\u0131da ileti\u015fim kurabilece\u011fiz.<\/p>\n<p><em>Asp.NET MVC&#8217;de Ajax ile \u00e7al\u0131\u015faca\u011f\u0131m\u0131zda hangi k\u00fct\u00fcphaneler projeye import edilmelidir?<\/em><br \/>\nAsp.NET MVC Ajax k\u00fct\u00fcphaneleri JQuery ile desteklenerek daha sade ve h\u0131zl\u0131 bir &#8220;Ajax Helper&#8221; k\u00fct\u00fcphanesi olu\u015fturulmu\u015ftur.Bu k\u00fct\u00fcphanenin ad\u0131 &#8220;Unobtrusive JavaScript&#8221; tir.Bu k\u00fct\u00fcphaneyi kullanmak i\u00e7in \u00f6ncelikle web.config dosyas\u0131nda &#8220;AppSettings&#8221; alt\u0131ndaki &#8220;UnobtrusiveJavaScriptEnabled&#8221; alan\u0131 &#8220;true&#8221; de\u011ferine sahip olmal\u0131d\u0131r.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n  &lt;appSettings&gt;\r\n    &lt;add key=&quot;webpages:Version&quot; value=&quot;2.0.0.0&quot; \/&gt;\r\n    &lt;add key=&quot;webpages:Enabled&quot; value=&quot;false&quot; \/&gt;\r\n    &lt;add key=&quot;PreserveLoginUrl&quot; value=&quot;true&quot; \/&gt;\r\n    &lt;add key=&quot;ClientValidationEnabled&quot; value=&quot;true&quot; \/&gt;\r\n    &lt;add key=&quot;UnobtrusiveJavaScriptEnabled&quot; value=&quot;true&quot; \/&gt;\r\n  &lt;\/appSettings&gt;\r\n<\/pre>\n<p>Ard\u0131ndan ister &#8220;_Layout.cshtml&#8221; sayfas\u0131na istersenizde herhangi bir View sayfas\u0131na a\u015fa\u011f\u0131daki k\u00fct\u00fcphaneleri eklemeniz yeterlidir.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n@Scripts.Render(&quot;~\/Scripts\/jquery-1.8.2.min.js&quot;, &quot;~\/Scripts\/jquery.unobtrusive-ajax.min.js&quot;)\r\n<\/pre>\n<p>Evet art\u0131k Ajax ve Asp.NET MVC mimarisiyle Ajax&#8217;\u0131 kullanma mant\u0131\u011f\u0131 konusunda bilgiler edinmi\u015f olduk.Bundan sonraki yaz\u0131lar\u0131mda programatik Ajax i\u015flemlerini inceleyece\u011fiz.<\/p>\n<p>Sonraki yaz\u0131lar\u0131mda g\u00f6r\u00fc\u015fmek dile\u011fiyle&#8230;<br \/>\n\u0130yi \u00e7al\u0131\u015fmalar&#8230;<\/p>\n<!-- AddThis Advanced Settings generic via filter on the_content --><!-- AddThis Share Buttons generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"<p>Her ne kadar Asp.NET MVC mimarisinde Asp.NET Web Forms mimarisine k\u0131yasla Server yo\u011funlu\u011fu hafifletilmi\u015f olsada Client tabanl\u0131 algoritmalara zaman zaman ihtiya\u00e7 duyar\u0131z.G\u00fcn\u00fcm\u00fcz web sitelerinde her hangi bir tetiklenme an\u0131nda sistemin Server ile etkile\u015fimini ziyaret\u00e7ilere&#46;&#46;&#46;<!-- AddThis Advanced Settings generic via filter on get_the_excerpt --><!-- AddThis Share Buttons generic via filter on get_the_excerpt --><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11,345],"tags":[744,746,516,265,748,283,518,517],"class_list":["post-2216","post","type-post","status-publish","format-standard","hentry","category-asp-net-mvc","category-mvc-4-0","tag-ajax","tag-asp-net-mvc","tag-html-helper","tag-javascript-2","tag-jquery","tag-mvc","tag-postback","tag-unobtrusive-javascript"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/2216","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=2216"}],"version-history":[{"count":0,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/2216\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media?parent=2216"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/categories?post=2216"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/tags?post=2216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}