ASP ve Jquery-Ajax[GET ve POST]

Bu konu boş.

8 yanıt dizini görüntüleniyor

Yazar

Yazılar

13 Ağustos 2009: 12:31 #6613

-FeYYaZ-

Ziyaretçi

Bu konuda sizlere ASP ile Ajax kullanımını anlatacağım.

Kolaylık olması açısından jQuery Javascript Kütüphanesini kullanacağız.Jqüry kütüphanesini indirmek için http://www.jquery.com/” onclick=”window.open(this.href);return false; sayfasında bulunan Download(jQuery) butonunu tıklayın.

Ajax ile 2 şekilde veri gönderebilirsiniz:
1-GET
2-POST
İlk olarak ben GET metoduna değineceğim.GET metoduyla gönderdiğimiz verileri sayfada Reqüst.QueryString komutuyla çağırabilirsiniz.Fazla uzatmadan kodlara geçelim.

Bu bizim içerik alma sayfamız olsun:

İlk önce bu kod ile jqüry kütüphanesini sayfamıza çağıralım:

<script language="javascript" src="jquery-1.3.2.min.js"></script><br />

1 2	<script language="javascript" src="jquery-1.3.2.min.js"></script><br />

Daha sonra ajax isteği oluşturan bir fonksiyon yazalım:

<br />
<script language="javascript"><br />
function icerikal(){<br />
$.ajax({<br />
type: 'GET',<br />
url: 'icerik.asp',<br />
data: 'tur=haber',<br />
success: function(ajaxCevap) {<br />
$('#sonuc').html(ajaxCevap);<br />
}<br />
});<br />
}<br />
</script><br />

function icerikal(){

$.ajax({

type: 'GET',

url: 'icerik.asp',

data: 'tur=haber',

success: function(ajaxCevap) {

$('#sonuc').html(ajaxCevap);

}

});

}

</script>

TYPE ile veri gönderme metodu,URL ile veri göndereceğimiz ASP sayfasını,DATA ile de verimizi belirliyoruz.Success da da Ajax işlemi başarılı olduğunda çalıştırılacak fonksiyonu belirtiyoruz.

DATA kısmında farkettiyseniz tur=haber yaptım.Buradaki tur QueryString’imiz oluyor.Böylelikle icerik.asp sayfamızdan haber içeriği çekmiş olacağız.icerik.asp sayfasında if kontrolü ile mesela tur=haber ise haberleri listele,tur=ders ise dersleri listele şeklinde bir sorgulama yapacağız.

Success da belirttiğimiz fonksiyon ise gelecek olan içeriğin, id’si sonuc olan Div elementimizde görünmesini sağlıyor.

Şimdi de bir buton oluşturacağız ve butona basıldığı takdirde icerikal() fonksiyonumuz çalışacak yani içerikleri almış olacağız.

<br />
<button onclick="icerikal();">İçerik Al</button><br />

<button onclick="icerikal();">İçerik Al</button>

Onclick ile butona basıldığında çalışacak olan fonksiyonu belirledik.

Geriye içeriğin gözükeceği div’imiz kaldı:

<div id="sonuc">İçerik Burda Gözükecek</div><br />

1 2	<div id="sonuc">İçerik Burda Gözükecek</div><br />

Şimdi de icerik.asp sayfamızda kontrolümüzü yapalım:

<%<br />
If Request.QueryString("tur")="haber" then<br />
Response.write "Haber1<br />Haber2<br />Haber3<br />Haber4"<br />
Elseif Request.QueryString("tur")="ders" then<br />
Response.write "Ders1<br />Ders2<br />Ders3<br />Ders4"<br />
End If<br />
%><br />

<%

If Request.QueryString("tur")="haber" then

Response.write "Haber1 Haber2 Haber3 Haber4"

Elseif Request.QueryString("tur")="ders" then

Response.write "Ders1 Ders2 Ders3 Ders4"

End If

%>

Sayfamızdaki butona bastığımızda haberlerin listelendiğini göreceksiniz.Dersleri de denemek için DATA kısmını ‘tur=ders’ yapmanız yeter.

Eğer Türkçe karakter sorunu yaşarsanız icerik.asp sayfanıza şu kodu ekleyin:

<%<br />
Response.Charset="windows-1254"<br />
%>

<%

Response.Charset="windows-1254"

Şimdi de POST metodunu anlatalım:

Aslında ikisi arasında pek fark yok.Kodlarda ufak bi değişiklikle post metoduyla veri alma işlemini gerçekleştirebilirsiniz.

Bu bizim içerik alma sayfamız.Farkettiyseniz type parametresi POST.Onun haricinde hiçbir değişiklik yapmıyoruz.Data kısmınıda aynı bırakıyoruz.tur=haber şeklinde gönderdik.Asp sayfamızda da Request.Form(“tur”) şeklinde alacağız çok basit.

<script language="javascript" src="jquery-1.3.2.min.js"></script><br />
<script language="javascript"><br />
function icerikal(){<br />
$.ajax({<br />
type: 'POST',<br />
url: 'icerik.asp',<br />
data: 'tur=haber',<br />
success: function(ajaxCevap) {<br />
$('#sonuc').html(ajaxCevap);<br />
}<br />
});<br />
}<br />
</script><br />
<button onclick="icerikal();">Yçerik Al</button><br />
<div id="sonuc">Yçerik Burda Gözükecek</div><br />

function icerikal(){

$.ajax({

type: 'POST',

url: 'icerik.asp',

data: 'tur=haber',

success: function(ajaxCevap) {

$('#sonuc').html(ajaxCevap);

}

});

}

</script>

<button onclick="icerikal();">Yçerik Al</button>

<div id="sonuc">Yçerik Burda Gözükecek</div>

İşte ASP sayfamız:

       <%<br />
Response.Charset="windows-1254"<br />
%><br />
<%<br />
If Request.Form("tur")="haber" then<br />
Response.write "Haber1<br />Haber2<br />Haber3<br />Haber4"<br />
Elseif Request.Form("tur")="ders" then<br />
Response.write "Ders1<br />Ders2<br />Ders3<br />Ders4"<br />
End If<br />
%><br />

<%

Response.Charset="windows-1254"

%>

<%

If Request.Form("tur")="haber" then

Response.write "Haber1 Haber2 Haber3 Haber4"

Elseif Request.Form("tur")="ders" then

Response.write "Ders1 Ders2 Ders3 Ders4"

End If

%>

Umarım anlatabilmişimdir. 8-)

13 Ağustos 2009: 16:20 #8784

Anonim
Ziyaretçi

Gerçekten çok başarılı bir anlatım yapmışsın.. Tebrik ederim seni feyyaz.
16 Ağustos 2009: 13:01 #8781

Anonim
Ziyaretçi

Şimdi merak ettiğim olay şu: ben inputun içine girdiğim veriyi onblur ile nasıl vt’den kontrol edip ekrana yazdırabilirim ? Derslerinin devamını bekliyorum..
16 Ağustos 2009: 13:51 #8782

Anonim
Ziyaretçi

@sagoral wrote:

Şimdi merak ettiğim olay şu: ben inputun içine girdiğim veriyi onblur ile nasıl vt’den kontrol edip ekrana yazdırabilirim ? Derslerinin devamını bekliyorum..

Tamam konuyu genişleticem çeşitli örneklerle hepsini anlatıcam.
16 Ağustos 2009: 14:14 #8783

Anonim
Ziyaretçi

@-FeYYaZ- wrote:

@sagoral wrote:

Şimdi merak ettiğim olay şu: ben inputun içine girdiğim veriyi onblur ile nasıl vt’den kontrol edip ekrana yazdırabilirim ? Derslerinin devamını bekliyorum..

Tamam konuyu genişleticem çeşitli örneklerle hepsini anlatıcam.

Tamam bekliyorum :)

14 Şubat 2010: 10:23 #8780

Anonim

Ziyaretçi

Çok teşekkür ediyorum. Anlattıklarınız gerçekten çok işime yaradı.
Ayrıca verdiğiniz örnekleri şu şekilde kullanarak birden fazla veriyi sayfama gönderebildim. Bu sayede sayfayı yenilemeden yorum ekleme gibi bir çok şey yapılabilir. Bir kez daha teşekkür ediyorum..

<br />
function icerikal(){<br />
$.ajax({<br />
type: 'GET',<br />
url: 'yorum.asp',<br />
data: 'kimden=' + document.form1.kimden.value + '&amp;kime=' + document.form1.kime.value + '&amp;yorum=' + document.form1.yorum.value,<br />
success: function(ajaxCevap) {<br />
$('#veri').html(ajaxCevap);<br />
}<br />
});<br />
}<br />

function icerikal(){

$.ajax({

type: 'GET',

url: 'yorum.asp',

data: 'kimden=' + document.form1.kimden.value + '&kime=' + document.form1.kime.value + '&yorum=' + document.form1.yorum.value,

success: function(ajaxCevap) {

$('#veri').html(ajaxCevap);

}

});

}

Denedim hem Firefox hemde IE 7 de sorunsuz çalışıyor.

9 Temmuz 2010: 00:50 #8785

Anonim
Ziyaretçi

İşine yaradıysa ne mutlu ;)
9 Ağustos 2011: 21:33 #8786

Anonim
Ziyaretçi

Çok güzel bir anlatım olmuş teşekkürler emeğinize sağlık bende şunu belirtmek isterim anlatılan konu asp örneği ile yapılmış aynı şekilde php içeriğinde de kullanılabilir.
1 Kasım 2011: 00:05 #8787

Anonim
Ziyaretçi

Teşekkürler.

Yazar

Yazılar

8 yanıt dizini görüntüleniyor

Bu konuyu yanıtlamak için giriş yapmış olmalısınız.