Bugün yayınımın ilk gününde sizlerle Ajax'a giriş yapacağız. Sizlere önceden geliştirdiğim bir uygulamadan bahsedeceğim, bu uygulamada dış kaynaklı bir XML dosyasından sayfamıza veri çekip sayfamızda gösterteceğiz. Ama isterseniz kodlara geçmeden önce Ajax hakkında kısa bir bilgi verelim.
Ajax, “Asynchronous JavaScript and XML” (Türkçe: Eşzamansız JavaScript ve XML) anlamına gelen, JavaScript ve XMLHttpRequest kullanımı ile etkileşimli uygulamalar yaratan ve bir çok programlama dili ile uyumlu çalışan bir tekniktir. Kesinlikle bağımsız bir programlama dili değildir. Peki ama Ajax ile neler yapılabilir? Birden fazla amaca hizmet eder.
- Sayfayı yeniden yüklemeye gerek kalmadan güncellememizi sağlar.(Bana göre en büyük özelliği)
- Sayfa yüklendikten sonra sunucuya istek gönderebilir.
- Sayfa yüklendikten sonra sunucudan veri alabilir.
- Arka planda sunucuya veri gönderebilir.
gibi özellikleri mevcuttur. Daha fazlası için http://www.w3schools.com/ajax/ adresini ziyaret edebilirsin. Bahsettiğim projeye gelecek olursak.
İlk önce XML dosyasını oluşturuyoruz ve verileri giriyoruz. Sonrasında ise:
oluşturacağımız HTML dosyası içine Ajax olayını tetikleyebileceğimiz bir buton ve XML verilerini göserebileceğimiz bir tablo oluşturuyoruz.
Son aşamada ise script olaylarının gerçekleşeceği script kodlarını yazıyoruz. İlk olarak butona basıldığında tetiklenecek fonksiyonu yazıyoruz. Bu fonksiyonu açıklamak gerekirse ilk önce sunucuya istek oluşturuyoruz (14.satır). Daha sonra Ajax içinde gerçekleştireceğimiz olayları tanımlamak için onreadystatechange() fonksiyonu oluşturuyoruz. En son get metodu ile bir bağlantı açıyoruz ve isteğimizi gönderiyoruz.
İkinci aşamada myFunction fonksiyonunda ise sunucudan gelen XML cevabı for döngüsüyle oluşturduğumuz tabloya kaydediyoruz.
Kodları anlaşılır kılmak için en sade halleriyle yazdım. Kodu indirmek isteyenler https://github.com/emresolugan/Ajax-XML-File-Example github adresimden indirebilirler.
Bir sonraki makalede NodeJS ile chat uygulaması yapacağız. İyi günler.
No comments:
Post a Comment