Ajax etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
Ajax etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

21 Mart 2010 Pazar

Ajax Türkçe Karakter Sorunu (ÇOZULDU)

Etrafımda sık sık Ajax(AJAX (İngilizce:Asynchronous JavaScript and XML), İnternet sayfalarında JavaScript ve XMLHttpRequest kullanımı ile etkileşimli uygulamalar yaratan tekniğin adıdır.) Programlama ile uygulama geliştirme sonucunda Türkçe harf ve karakter sorunu yaşayan insanların olduğunu görüyorum. Bu herkesçe kabul edilmiş Standartların dışında çalışmanın neticesinde bu gibi sorunlar yaşamanız çok normal. Bu yazıda Ajax Dilinin kullanımı sonucunda Türkçe Dil Sorununu aşmak için dikkat edilmesi gereken nelerdir, bunlardan bahsedilecektir.Dikkat edilmesi gereken nokta sadece ajax kullanacağınız zaman değil, her zaman uygulamanızı tavsiye ederim.

Öncelikle tüm dosyalarınızı UTF-8 formatında kaydedin. Yaşanan Türkçe karakter sorunlarının büyük bir nedeni bu. Dikkat edilmesi gereken şey tüm dosyaların utf-8 olması gerektiği. index.html den ajax.php dosyasına ajax isteği gönderdiğimizi varsayalım. Bu 2 dosyadan biri utf-8 diğeri ANSI veya başka format ise gene Türkçe karakter sorunu yaşayabilirsiniz. Dosyalarınızı nasıl utf-8 formatında kaydedeceğinizi öğrenmek için kullandığınız metin düzenleyicinin kullanım kılavuzuna bakınız.

Ajax isteğinin yapıldığı sayfada bloğunda utf-8 karakter kodlaması kullandığınızı belirtin. Bunun için bloğuna şu kodu eklemeniz gerekir;

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Eğer bu iki maddeye dikkat ederseniz Ajax uygulamalarınızda Türkçe karakter sorununu bertaraf edebilirsiniz.

Bir başka yazıda görüşmek üzere..

22 Ocak 2010 Cuma

jQuery İle “Gizle/Göster” Sütun ve Tablo Yapımı

Ajax, animation, collapse, content, effect, expand, gizle, göster, içerik, jquery, panel, slide, sütun, table, tablo, toggle, yapımı
JQuery ile Gizle ve Göster Yapımı

Bu yazımızda jQuery ile sitemizdeki sağ yada sol sütunu, tabloyu yada paneli nasıl gizle/göster yapabileceğimizle ilgili uygulama hazırladım. Çalışma mantığı, daha önce anlattığım (jQuery İle “Tab” Uygulaması Geliştirmek) yazısındaki uygulama ve çalışma mantığıyla neredeyse aynıdır. Tek farkı! Bu uygulamada animasyonun daha fazla olması. Çalışan örneği için BU bağlantıya bakabilirsiniz.

Şimdi öncelikle site içeriklerini Ana Tablo içine aldım;



Ana Tablo için eklediğim stil;

http://pastebin.com/f15064a3d

Şimdide sırayla içerikleri doldurmaya başlıyorum. Öncelikle Gizle/Göster butonlarını ekledim;


http://pastebin.com/f7744c251

Gizle/Göster butonları için eklediğim stil;

http://pastebin.com/f721f3ddd

Tabii bu bölümde de atlamamak lazım! Kullanıcılarımıza sadece “Gizle” butonu gösterileceğinden, “Göster” butonunu stille ekstra olarak gizledim;

http://pastebin.com/f6f0fb0b5

Sağ Sütun için eklediğim stil;

http://pastebin.com/f3a24965d

ve son olarak da Sol Sütunu ekledim;

http://pastebin.com/f7ff33077
Sol Sütun için eklediğim stil;
http://pastebin.com/f7254e134

 
Sayfa için kullanacağımız XHTML kodları burada bitiyor. Buradan sonrasında jQuery ile yazacağımız fonksiyonlar çalışacak.

jQuery kodlarını vermeden önce hazırladığım fonksiyonların ne işe yaradığından bahsetmek istiyorum. Öncelikle ilk fonksiyonumuz, “Gizle” butonu tıklanınca “Sağ Sütun” ve “Gizle” buttonu kaybolacak, kaybolan sütun yerine “Sol Sütun“‘u genişletecek, genişleyecek ama bir yandan da sağdan “Göster” butonu kadar boşluk bırakacak. İkinci fonksiyonumuzda ise “Göster” butonu tıklanınca “Gizle” butonu kaybolacak, “Sol Sütun” belirttiğimiz ölçüde tekrar daraltılacak, “Sağ Sütun” ve “Gizle Butonu” gösterilecek, gösterilecek ama “Sağ Sütun“‘un sağına “Gizle” butonun sığıcağı kadar boşluk ekleyecek. Aman dikkat!!! Anlattıklarımdan kafanız karışmasın. Sadece anlattıklarımı hayal edip, “- tabi ya! böle yapınca bu olucak, şöle yapınca şu olucak.” gibisinden düşünebilirsiniz…

Neyse, yukarıda anlattıklarım hayal ürünü olmaktan çıkıp, kodsal olarak bu şekli alıyor;

 http://pastebin.com/f1cb33fb2

 

Hepsi bu kadardı. Sanırım çok güzel oldu… Bir sonraki jQuery uygulamasında görüşmek dileğiyle.
NOT: ölçülendirmelerde “10px“‘lik gölge payları vardır.
DİPNOT: ölçüler ve sağ/sol konum değiştirilebilir.