"Enter"a basıp içeriğe geçin

Jquery İle Post İşlemi


form class="contact-form"
  input type="text" id="name" placeholder="İsim Soyisim"
  input type="text" id="email" placeholder="E-Posta Adresiniz"
  input type="text" id="subject" placeholder="Konu"
  textarea id="message" cols="30" rows="10" placeholder="Mesajınız..."
  button type="submit">Gönder
form

$(".contact-form").submit(function (e) {
  e.preventDefault();
  $.post('static/send.php', {
    name: $("#name").val(),
    email: $("#email").val(),
    subject: $("#subject").val(),
    message: $("#message").val(),
  }, function (response) {
    $(".contact-form").fadeOut();
    $(".alert-success").fadeIn();
  });
  return false;
});

Kodun altındaki FadeOut ile formumuza tekrar tekrar post edilmesini önlemek amacı ile sayfadan kaldırıyoruz ve .alert-success adını verdiğimiz herhangibir class’a sahip divimizi gösteriyoruz. “Başarıyla Mesajınız Gönderildi” Filan olayı.
Not: fadeOut – fadeIn display:none/block mantığı ile çalışır.