Butonu 1 kere post ettirme

mek 1077 gün önce

855 defa görüntülendi

Php'de post ederken arka tarafta herhangi bir kontrol sağlamazsak butona birden fazla basıldığı zaman aynı veri çok fazla giriş yapabiliyor. Bu durumun nasıl önüne geçebilirim?

php

Soru hatalı mı? 👎

Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!

Spam olarak işaretle

Cevap yaz

הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Cevaplar (6)

ebykdrms

1077 gün önce

Ajax ile post etmekten bahsediyorsanız şöyle bir örnek vereyim:

<form id="userForm">
    <input id="username" type="text" value="mek" />
    <button>Gönder</button>
</form>

İçinde sadece 1 input olan formumuzu ajax ile post etmek istiyoruz.

var $userForm = $("#userForm");
var $usernameInput = $userForm.find("#username");

$userForm.on("submit", function(e) {
    e.preventDefault(); // formun direkt gönderilmesini engelliyoruz.
    if($userForm.hasClass("waiting")) return; // Eğer formda "waiting" adında bir class varsa hiçbir işlem yapılmasın.
    if($usernameInput.val().trim()==="") { alert("Kullanıcı adı zorunludur!"); return; } // Kullanıcı adı boş gönderilemesin.
    $userForm.addClass("waiting"); // artık ajax isteğinden sonuç bekleyeceğimiz için forma "waiting" class'ını ekleyebiliriz.
    var username = $usernameInput.val().trim();
    $.ajax({
        url: "add_user.php",
        type:"post",
        data: { username: username },
        success:function(response) {
            // Örnek olarak gelen yanıta göre işlemler yapıyorum:
            if(response.type==="error") alert(response.errorMessage);
            else if(response.type==="success") { 
                alert(username+" adlı kullanıcı başarıyla eklendi.");
                $usernameInput.val("");
            }
            else alert("Bilinmeyen bir sonuç döndü.");
            // Artık yanıttan cevap döndüğüne göre formu "waiting" class'ından arındıralım.
            $userForm.removeClass("waiting");
        },
        error: function() {
            alert("Bir sorunla karşılaşıldı.");
            $userForm.removeClass("waiting");
        }
    });
});

Böylece, form ajax ile submit edilirken yanıt dönene kadar form'a "waiting" class'ı atamış olduk. Butona tıklandığında da eğer formda "waiting" class'ı varsa işlem yapmamasını söyledik. Artık kullanıcı firebug üzerinden kodla müdahale etmediği sürece tekrar tekrar butona tıklanmasının bir anlamı olmayacak. Biz yine de CSS yardımıyla da butona basılmasını önleyelim.

* { margin:0; padding:0; box-sizing:border-box; outline:none; }
#userForm { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#userForm #username { width:100px; height:30px; text-indent:10px; border:1px solid #777; border-radius:5px 0 0 5px; }
#userForm button { width:80px; height:30px; border:1px solid #777; background-color:#ccc; border-radius:0 5px 5px 0; border-left:none; transition:color ease .3s, background-color ease .3s; }
/* #userForm eğer .waiting class'ına sahipse butona tıklanamasın: */
#userForm.waiting button { pointer-events: none; background-color:#eee; color:#aaa; }

Yine waiting class'ının varlığına göre farklı stiller (loading gif'i göstermek gibi) yapılabilir.

#009735

mek

1076 gün önce

Yanıtlarınız için gerçekten çok teşekkür ederim. Aklımdaki soruya; @ebykdrms hocam direkt yardımcı oldu. Sorunu çözdüm çok teşekkür ederim ihtiyacı olan aynı şekilde kullanabilir.

#009749

kartal

1076 gün önce

Merhaba submit edildikten sonra butona bir loading class ekle daha sonra ajax işlemi bitince settimeout ile süre geciktir 3 5 saniye sonra butonun clasını eski halibe getir burada kullanıcı defalarca bassa dahi tek sorgu gidecektir.

#009747

mubado

1077 gün önce

if ile bakabilir sonrada formu sıfırlayabilirsin ;
if($_POST){
// Verileri buraya yazabilirsin
}

#009736

admin

1077 gün önce

butuna loadind ve disabled ozelligi eklersen 1 kez post olur.

#009733

munzevi

1077 gün önce

veriyi kaydetmeden once ayni icerik varsa hata mesaji ver ve kaydetme

#009732