jQuery ile veri göndermek/almak (POST) – aycan.net

Merhaba arkadaşlar, bu jquery post amator bir post’dur yani fazla kod kalabalığı vardır. Ama benim amacım sizlere yolu göstermek, yolda yürümek sizin işiniz. Bu form’u nasıl daha prof yapabilirdik onuda anlatacak olursak ;

1 – Tek tek input value’lerini almaktan ziyada each ile topluca alabilirdik.

2 – E posta kontrolu yaptırabilirdik

3 – jQuery post yaparken serialize(); ile değerleri gönderebilirdik.

4 – Post edilirken yükleiyor tarzı bir resim gösterebilirdik.

Ama şimdi yaptığımız kısımları anlatıyorum.

Şimdilik bu kadar, sömürgeci olmamanız ve blogumda (fikir/duygu/düşünce)lerinizi belirtmeniz dileğiyle…

Kodlar ve anlatımları

$(document).ready(function () {
    // gonder class'li buton click edildiginde yani tiklanildiginda
    $('.gonder').click(function () {

        // Formun icindeki inputlarin verilerini kontrol icin tek tek aliyoruz.
        // Normalde bu kontrolu each ile alip ugrasmadan ekrana hata mesajları gösterebilirdik ama kafa karıştırıcı olmasın diye böyle anlatıyorum.
        var adi = $('#adi').val();
        var eposta = $('#eposta').val();
        var mesaj = $('#mesaj').val();

        //Verileri aldik, şimdiki işimiz uzun yoldan verileri tek tek kontrol etmek : )
        //Girilen isim 3 karakterden buyukse devam et
        if (adi.length & gt; 2) {
            // Girilen e-posta 5 karakterden buyuk ise devam et
            if (eposta.length & gt; 5) { // Girilen mesaj 6 karakterden buyuk ise devam et.
                if (mesaj.length & gt; 6) {
                    /**
                     * Asil isimiz burada arkadaşlar Post işlemine başlıyoruz
                     * $.post = jquery ile post etmeye basliyoruz
                     * "mailGonder.php" = verileri gondereceginiz sayfanin url'sinii yaziyorsunuz
                     * {adi:adi,eposta:eposta,mesaj:mesaj} = burasi ise aldigimiz verileri tek tek gonderiyoruz,
                     * Bu kisim cok amator oldu ama serialize'ye gecmeden once bu sekilde anlatmak istedim.
                     * function(donenVeri){alert(donenVeri);} = Bu kisim ise post edilen sayfadan geri donen cevabtır.
                     **/
                    $.post("mailGonder.php", {
                        adi: adi,
                        eposta: eposta,
                        mesaj: mesaj
                    }, function (donenVeri) {
                        alert(donenVeri);
                    });
                } else
                    alert("Lütfen mesaj\u0131n\u0131z\u0131 giriniz");
            } else
                alert("Lütfen email adresinizi giriniz.")
        } else
            alert("Lütfen ad\u0131n\u0131z\u0131 ve soyad\u0131n\u0131z\u0131 giriniz.");
    });
});

$(document).ready(function () {

// gonder class'li buton click edildiginde yani tiklanildiginda

$('.gonder').click(function () {

// Formun icindeki inputlarin verilerini kontrol icin tek tek aliyoruz.

// Normalde bu kontrolu each ile alip ugrasmadan ekrana hata mesajları gösterebilirdik ama kafa karıştırıcı olmasın diye böyle anlatıyorum.

var adi = $('#adi').val();

var eposta = $('#eposta').val();

var mesaj = $('#mesaj').val();

//Verileri aldik, şimdiki işimiz uzun yoldan verileri tek tek kontrol etmek : )

//Girilen isim 3 karakterden buyukse devam et

if (adi.length & gt; 2) {

// Girilen e-posta 5 karakterden buyuk ise devam et

if (eposta.length & gt; 5) { // Girilen mesaj 6 karakterden buyuk ise devam et.

if (mesaj.length & gt; 6) {

/**

* Asil isimiz burada arkadaşlar Post işlemine başlıyoruz

* $.post = jquery ile post etmeye basliyoruz

* "mailGonder.php" = verileri gondereceginiz sayfanin url'sinii yaziyorsunuz

* {adi:adi,eposta:eposta,mesaj:mesaj} = burasi ise aldigimiz verileri tek tek gonderiyoruz,

* Bu kisim cok amator oldu ama serialize'ye gecmeden once bu sekilde anlatmak istedim.

* function(donenVeri){alert(donenVeri);} = Bu kisim ise post edilen sayfadan geri donen cevabtır.

**/

$.post("mailGonder.php", {

adi: adi,

eposta: eposta,

mesaj: mesaj

}, function (donenVeri) {

alert(donenVeri);

});

} else

alert("Lütfen mesaj\u0131n\u0131z\u0131 giriniz");

} else

alert("Lütfen email adresinizi giriniz.")

} else

alert("Lütfen ad\u0131n\u0131z\u0131 ve soyad\u0131n\u0131z\u0131 giriniz.");

});

Uygulamayı indir / Uygulama Ön izleme

Post Views: 13.276

“jQuery ile veri göndermek/almak (POST)” üzerine 18 yorum

çok iyi anlatmışsın açıklamalarda çok iyi olmuş , çok yararlı anlatım olmuş eline sağlık..

Yanıtla

Aycan BÜLBÜL dedi ki:

04 Ocak 2012, 16:14

Teşekkürler Çağlar.

Yanıtla

adi:adi,eposta:eposta,mesaj:mesaj kısımları yerine serialize girsek daha iyi olmazmı ?

Yanıtla

Aycan BÜLBÜL dedi ki:

26 Ocak 2012, 09:45

Tabiki daha güzel olur ama o zaman kontrolu each işle yapmak zorunda kalacaktık ve acemiler için makale biraz karışık olacakı 🙂

Yanıtla

TEKKOD Senin Yayında Olmaya Devam Edecek
Süper Bir Makale Olmuş Parmakların Dert Görmesin……

Her Zaman En Az Kod O Zaman TEKKOD

Yanıtla

Güzel bir yazı olmuş.Teşekkürler

Yanıtla

güzel çalışma.

Yanıtla

Geri bildirim: Anonim

Teşekkürler güzel paylaşım.

Yanıtla

Kardes guzel ama mesala sen php ‘ye gonderdikten sonra nereye echo yazmıssan
orası o donenveri adlı degiskene gidiyor.Problem su:o php dosyasında ornegin sen bir div ‘e class verdin echo “”;
ama tek bunu bile dondursen jquery scriptinde $(‘.ozan’).click(function(){
} diye event yapıyım desen olmuyor.Bunu nasıl asicaz.Yani postdan donen elementlere jqueryden class ve ya id yoluyla ne event veremiyorum.Cozumu varmi?

Yanıtla

Aycan BÜLBÜL dedi ki:

22 Eylül 2013, 03:19

sanırsam dönen elementleri olaylar içine sokmaya çalışıyorsunuz.

Bunun için o objeleri .on() ile dinleyebilirsiniz.

Yanıtla

Dediğinizi çok öncelerde de denedim hatta delegate,live leri de ama malesef sonuç vermiyor.Mesela sizi yorum sisteminizde reply da olsa ben reply butonunu phpden dondurdugumde ortak bir replay classina jqueryden desem ki $(“.reply”).click(function(){
$(this).after(“”);
bu live on delegate yada ustte yazdıklarım da calısmadıgından o andaki tıkladıgım reply butonu altına yeni bir text area ekleyemiyor.Ne demek istedigimi anlatabildim umarım.

Yanıtla

Aycan BÜLBÜL dedi ki:

22 Eylül 2013, 17:51

Dediğinizi anlamadım ama şunu söylüyorum, aycan classlı bir objeyi dönen veri ile ekrana bastırdığınızda,

$(window).on(‘click’,’.aycan’,function(){
alert(1)
});

bu ko ile o objeyi dinleyebilirsiniz.

Yanıtla