jquery image preview

jQuery: Upload Edilmeden Resim önizleme

jquery image previewjQuery ile gelen nimetlerden birini daha bugün inceleyelim. Form kullanarak upload edeceğimiz görsel dosyaları sunucuya yollamadan önce preview (önizleme) jQuery kodları ile mümkün. Kullanılabilirlik ve kolaylık için ziyaretçilerinize sunabilirsiniz. 

Formun file element değeri her değiştiğinde çalışan bu kod bloğu seçilen resimin local adresini ele alarak sayfada gösteriyor.

Demo uygulamanın kodları da bu mantık kadar basit aslında. Uygulamanın çalışan demosunu ve kaynak kodlarını yazının altında bulabilirsiniz.

Uygulama kodlarına geçelim;  […]

jQuery Uygulaması

jQuery Form Post

jQuery Uygulaması

Serpito arşivini kurcalarken, jQuery kütüphanesini kullanarak ajax form örneklerini hiç paylaşmadığımızı farkettim. Geç de olsa bu açığı kapatmaya çalışalım.

 

Özellikle sayfalarda kullanıcı yorumları veya mesajlarını iletebilmek için kullanılan formlar ,  jQuery kullanarak pratik bir şekilde Ajax ile çalıştırılabilmektedir.  […]

Slider Form

Jquery Fancy Sliding Form (Jquery Form)

Slider Form
Jquey web geliştiriciler için oldukca kullanışlı bir kütüphane. Jquery bazen hayal gücü sınırlarımız zorlamamıza neden olmakta. Sistemlerimizde kullana bileceğimiz insan kaynakları, iletişim, sipariş vb. formları bugunkü örnegimizle dahada geliştire bilir ve hızlı çözümler sunabiliriz.

Örneğimiz 5 sekmeli bir jquery form niteliğinde.  Her sekmede alanların doldurmamız gerekmekte doldurmadığımız takdirde en son bölümde gönder dediğimizde java script uyarısı karşımıza geliyor ve boş geçmiş olduğumuz alanlar açık pembe ile belirgin hale geliyor.

Boş geçilen alanlar tab içerisinde oldugunda fark edilmesi güç bunu önlemek içinde tabların üzerine bir sonraki taba geçildiginde ikon beliriyor ve bu ikona göre nerede hata yapmış olduğumuzu görebiliyoruz.

[…]

Jquery İletişim Formu

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. […]