Web projelerimizde yer alan ürünlere veya galerilere resimleri yüklemek için klasil dosya yükleme, dosyalar yüklenirken bir seferde sınırlandırma getirerek yükleme yapmamızı sağlıyor. Bir foto galeriye normal form file sistemi ile 1,3,5, gibi sınırlı yülemeler yapabiliyoruz. Bu örneğimize sayfamızı yenilemeden ajax ile fotograf dosyalarını yükleme işlemini uygulayacağız. Bu uygulamadaki asıl amaç çoklu dosya yükleme işlemleri yapmayı öğrenmek.

Web sistemlerimizde yer alan iletişim formlarını jquery ve ajax ile daha görsel ve kullanışlı bir hale getirebiliriz. Bu örneğimizde buton veya linke tıklanıldığında iletişim formumuz ekrana geliyor ve gerekli alanların doğruluk kontrolü yapılarak eposta yoluyoruz.Bu iletişim formu SimpleModal üzerine kurulmuştur. OnOpen, onShow ve onClose geriçağırımlarının kullanımı yanı sıra SimpleModal ile Ajax kullanımı gösterir.

Web sitelerimizdeki menülerin css’ler ve jquery ile daha ilgi çekici ve ilginç özellikler ekleye biliriz. Bu örneğimizde menü üzerine gelindiğinde menü gözüküyor ve alt menüleri de dropdown olarak gösteriyoruz.

Menü aşağıdaki biçimde açılıyor

Web sitemizde yer alan; ürün, haber, kitap, hikaye vb gibi verilere kullanıcıların yorum yapmaları ve düşünceleri yazmalarını sağlayan formlar oldukca popülerdir. Bu örnegimizde kullanıcı adı ve mesajını yazdığı anda sayfa yenilemesi olmadan Ajax ile mesahı veri tabanına kaydediyoruz ve mesajların yer aldığı “Son Mesajlar” bölümünde gösteriyoruz.

Web sitelerimizdeki verileri; örneğin arama sonuçlarında, kategorideki verilerde veya yorumlar bölümlerinde sayfalama sistemleri bullanmamız gerekmektedir. Gün geçtikçe bölümlerdeki veri oranları arttıkça sayfaların açılması uzun olabileceği gibi estetik olmayan görüntülerede sebep olabilir. Bu örneğimizde ajax ile sayfalama sistemi yapıyoruz.
Sistemimizde yer alan 24 adet veriyi 5 ‘erli olarak sayfalayacağı. Ajax ile yapamnın en büyük avantajı sayfa değiştirme işlemi yapmıyoruz url’miz hep sabit.
index.html kodları: