Asp.NET’te Ajax İle Post İşlemi

Merhaba,

Asp.NET Web Form uygulamalarında Ajax ile post işlemleri için genellikle UpdatePanel kullanmaktayız. Lakin bu içeriğimizde UpdatePanel gibi Ajax Componentlerini işimize alet etmeden saf bir manuel kodlamayla bu işlem nasıl gerçekleştiriliyor inceliyor olacağız.

Mevzu bahis Asp.NET Web Form mimarisi olduğu için Asp.NET MVC mimarisine özel yazdığım makalelerdeki mantıkta hareket etmeyeceğimizi şimdiden bildirmekte fayda var.

İlk olarak yapmamız gereken post işlemini gerçekleştireceğimiz .aspx sayfasında postu karşılayacak olan metodu oluşturmaktır. Ama bu metodu oluştururken dikkat etmemiz gereken husus şudur ki;

• System.Web.Services kütüphanesindeki WebMethod Attribute’u ile işaretlenmeli,
• static yapıda olmalıdır.

Aksi taktirde Asp.NET Web Forms mimarisinde ilgili metodu Ajax ile post yaparken tetikletmemiz mümkün olmayacaktır.

    public partial class Ornek : System.Web.UI.Page
    {
        [System.Web.Services.WebMethod]
        public static string OrnekPost(string parametre)
        {
            return parametre + " değeriyle post işlemi gerçekleştirildi.";
        }
    }

Gördüğünüz gibi postu karşılayacak metodumuz hazır. Şimdi Ajax kısmını inşa edebiliriz.

        <img src="http://icons.iconarchive.com/icons/paomedia/small-n-flat/24/sign-check-icon.png" id="btnGonder" />
        <script type="text/javascript">
            $(document).ready(function () {
                $("#btnGonder").click(function () {
                    $.ajax({
                        url: 'Ornek.aspx/OrnekPost',
                        dataType: 'json',
                        type: 'POST',
                        data: "{'parametre': '1234'}",
                        contentType: 'application/json; charset=utf-8',
                        success: function (data) {
                            alert(data.d);
                        }
                    });
                });
            });
        </script>

Gördüğünüz gibi Ajax işlemleri içinde bu şekilde kodlama yeterlidir. Burada dikkatini “data” ve “contentType” parametrelerine çekmek istiyorum. “data” parametresinde bildiğimiz kullanıma nazaran tek tırnak (‘) içerisinde parametre adını yazıp, ardından gene aynı şekilde değerini vermekteyiz. “contentType” özelliği ise post işlemi neticesinde back gerçekleşecek ve Compiler’ın derlediği html çıktı bizlere gönderilecektir. Heh işte o html yerine metotda geriye gönderilen veriyi json olarak elde etmek istediğimizi belirtmekteyiz. Gelen bu json değeri success parametresinin data parametresindeki “d” propertysiyle karşılayacağız. Bu d özelliği yapısal olarak dinamik oluşturulacaktır.

Asp.NET’te Ajax İle Post İşlemi

Sonraki yazılarımda görüşmek üzere…
İyi çalışmalar…