ASP.NET MVC 5 ile Post Controller Oluşturma ve AJAX ile Post İsteği Gönderme Örneği

Bu örnekte, ASP.NET MVC 5 kullanarak bir Post Controller oluşturmayı ve bu controller üzerinden AJAX (Asynchronous JavaScript and XML) kullanarak bir post isteği göndermeyi öğreneceksiniz. Post Controller, gelen veriyi işler ve JSON formatında bir cevap dönerken, AJAX isteği kullanıcı tarafından tetiklendiğinde bu istekle iletilen verileri sunucuya ileterek bir post işlemi gerçekleştirir. Bu örnekle, web uygulamalarında veri iletişimi ve sunucu işlemleri konularında temel bir anlayış geliştirebilirsiniz.

ASP.NET MVC 5 kullanarak post controller oluşturmak, sonra bu controller üzerinden AJAX ile bir post örneği yapmak oldukça yaygın bir işlemdir. İşte adım adım nasıl yapılacağına dair açıklamalar:

Adım 1: Post Controller Oluşturma

Öncelikle ASP.NET MVC 5 projenizde yeni bir controller oluşturmalısınız. Controller'ı oluşturmak için aşağıdaki adımları takip edebilirsiniz:

  1. Visual Studio veya tercih ettiğiniz geliştirme ortamınızı açın.
  2. Solution Explorer'da projenizin üzerine sağ tıklayın.
  3. Add -> Controller seçeneğini seçin.
  4. Controller Sınıfı oluştur penceresinde "Empty MVC Controller" seçeneğini belirleyin ve bir isim verin (örneğin, "PostController").
  5. Controller'ı oluşturun.

Şimdi, bu yeni controller içinde bir POST işlemi gerçekleştiren bir aksiyon ekleyelim.

using System.Web.Mvc;

namespace YourProjectName.Controllers
{
    public class PostController : Controller
    {
        [HttpPost]
        public ActionResult CreatePost(string postData)
        {
            // Post işlemini burada işleyin
            return Json(new { success = true, message = "Post başarıyla oluşturuldu." });
        }
    }
}

Adım 2: AJAX ile Post İsteği Gönderme

Şimdi, bu controller'daki "CreatePost" adlı aksiyonu AJAX kullanarak çağırabiliriz. jQuery ile basit bir AJAX örneği aşağıda verilmiştir:

<!DOCTYPE html>
<html>
<head>
    <title>Post Örneği</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <button id="postButton">Post Yap</button>
    <div id="result"></div>

    <script>
        $(document).ready(function () {
            $("#postButton").click(function () {
                $.ajax({
                    url: '/Post/CreatePost',
                    type: 'POST',
                    data: { postData: "Bu bir post verisidir." },
                    success: function (response) {
                        $("#result").html(response.message);
                    },
                    error: function () {
                        $("#result").html("Post işlemi sırasında bir hata oluştu.");
                    }
                });
            });
        });
    </script>
</body>
</html>

Açıklamalar:

  • Post Controller Açıklaması: Post işlemlerini işlemek için bir controller oluşturduk ve bu controller içinde "CreatePost" adlı bir aksiyon ekledik. Bu aksiyon, gelen veriyi işler ve JSON formatında bir cevap döner.

  • AJAX Açıklaması: jQuery kullanarak bir AJAX isteği gönderdik. İsteğin URL'si "/Post/CreatePost" olarak belirtildi ve HTTP POST yöntemi kullanıldı. Veri olarak "postData" adında bir parametre gönderildi. AJAX isteği başarılı olduğunda veya hata aldığında ekrana uygun mesajları yazdık.

Umarım bu açıklamalar, ASP.NET MVC 5 kullanarak bir post controller oluşturmayı ve AJAX ile post örneği yapmayı anlamanıza yardımcı olur.

Kategoriler