Mvc Jquery Ajax Post

Posted by

Merhaba arkadaşlar, bu yazımda sizlere Mvc Jquery Ajax Post işlemi nasıl yapılır ondan bahsetmeye çalışacağım.

Bazı durumlarda sayfamızı yenilemeden(refresh etmeden) anlık olarak birtakım işlemleri uygulamak ve ekrana yansıtmamız gerekebilir. Bu gibi durumlarda Jquery Ajax Post işlemini kullanabiliriz. Jquery Ajax Post işlemi ile hem hızlı bir şekilde hem de sayfa yenilenmeden anlık olarak ekrana değişiklikleri yansıtabiliriz.

Şimdi gelelim Mvc ile Jquery Ajax Post işlemini nasıl gerçekleştirebileceğimize.

Örneğin sitemize bir yorum geldi ve bizim bunu onaylamamız gerekiyor. Onaylama işlemini de Ajax Post ile gerçekleştirmek istiyoruz. Aşağıdaki kod ile bu işlemi gerçekleştirebiliriz.


var id = 1;

$.ajax({
url: "/Comment/Approve",
type: "POST",
dataType: "json",
data: { commentId: id },
success: function (data) {
if (data.result == 1)
alert(data.message);
else
alert("Onaylama Başarısız!");
}
});

Öncelikle parametrelerden bahsetmek istiyorum.

Url: Post işlemimizin hangi url ile gerçekleştireceğimizi belirtiyoruz. Mvc için de ilgili controller’ın ilgili action’ı olarak belirtiyoruz. Url’yi yukarıdaki gibi de yazabiliriz, eğer istersek aşağıdaki gibi de yazabiliriz.
‘@Url.Action(“Approve”,”Comment”)’

Type: Get ya da Post işlemi yapacak isek bu parametre ile belirlememizi sağlayan parametredir.

DataType: Sunucudan dönen veri türünün belirlenmesini sağlayan parametredir.

Data: Göndereceğimiz verinin ilgili bilgilerini tutar. Diğer bir deyişle göndereceğimiz parametreleri bu kısımda belirleyip gönderme işlemini sağlayabiliriz. Örneğin yukarıdaki kod örneğinde bir commentId gönderiyoruz.

Success: Ajax isteğimiz başarılı bir şekilde tamamlanmış ise bu kısımda yazdığımız fonksiyon çalışacaktır. Bize dönen verileri bu kısımda kontrol etme ve ekranda işleme ile ilgili kodlarımızı yazabiliriz.

Yazdığımız örnekte CommentId’si 1 olan yorumun onaylanma işlemi controller tarafında yazdığımız kod ile gerçekleştirilip ona göre başarılı ya da başarısız olarak bir sonuç dönecektir.

Şimdi de Controller’da bulunan kodumuzu yazalım.


[HttpPost]
public ActionResult Approve(int commentId)
{
// bu kısımda yorum ile ilgili veya siz ne için kullanmak
// istiyorsanız ilgili kodunuzu yazıyorsunuz.
// Daha sonra da buna göre bir sonuc döndürebilirsiniz.

return Json(new { result = 1, message = "Başarılı."});
}

Controller’da bir json verisi geriye döndürdük ve bu verinin içinde result ve message isimli iki tane anahtar değerimizi belirledik. Değişken gibi düşünülebilir. İlgili anahtar değerlerimize de bir value atadık. Result için 1 ve Message için Başarılı şeklinde bir atama gerçekleştirdik. Ajax için kullandığımız scriptte bulunan success fonksiyonu içinde de bu action’dan dönen verimiz data’ya gelmiş bulunmaktadır. Biz de data.result veya data.message yazdığımızda bu değerleri kullanabilir ya da ekrana yansıtabiliriz.

Faydalı olması dileğiyle…

3 comments

Leave a Reply

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir