En pratik çözüm css kullanmaktır:
input[name='elementName'] {
text-transform: uppercase;
}
css dosyasına bu kodu ekle:
name adlı text'i büyük harf yapar
input[name='name'] {
text-transform: uppercase;
}
eğer bütün textler büyük harf olsun istenirse:
input { text-transform: uppercase; }
Eğer bazı textler normal, diğerlerinin tamamı büyük harf olsun istenire,mesela kullanıcı ve şifre girişleri normal olsun:
input[name='username'] { text-transform: none; } input[name='password'] { text-transform: none; } input { text-transform: uppercase; }
eğer Textarea elementi büyük harf olsun istenirse:
textarea{ text-transform: uppercase; }Önemli not:"text-transform: uppercase;" durumu Türkçe karakter sorunlarına sebep olabilir.Meselai ve İ harflerinde sorun çıkacaktır.Çözüm için,nesneye lang="tr" tagını ekleyin .Örnek:<input type="text" id="id_customer" name="customer" lang="tr"/>Bir input için bunu yapabiliyoruz.Peki django tarafından form.as_p ile oluşturlan formdakitüm inputlara bunu nasıl atayabiliriz.Zirainput { text-transform: uppercase; }içine lang:'tr' yazma şansımız yok.Bu durumda jQuery kullanmak zorundayız.css dosyasınayukarda yazılanları siliyoruz, her html template dosyasına bu jQuery kodunu ekiyoruz.Böylececapslock küçük harf durumunda iken i tuşuna basıldığında I değil İ gelmiş olacaktır:<script type="text/javascript"> String.prototype.turkishToLower = function(){ var string = this; var letters = { "İ": "i", "I": "ı", "Ş": "ş", "Ğ": "ğ", "Ü": "ü", "Ö": "ö", "Ç": "ç" }; string = string.replace(/(([İIŞĞÜÇÖ]))/g, function(letter){ return letters[letter]; }) return string.toLowerCase(); } String.prototype.turkishToUpper = function(){ var string = this; var letters = { "i": "İ", "ş": "Ş", "ğ": "Ğ", "ü": "Ü", "ö": "Ö", "ç": "Ç", "ı": "I" }; string = string.replace(/(([iışğüçö]))/g, function(letter){ return letters[letter]; }) return string.toUpperCase(); } jQuery(document).ready(function(){ jQuery('input').keyup(function() { this.value = this.value.turkishToUpper(); }); jQuery('textarea').keyup(function() { this.value = this.value.turkishToUpper(); }); }); </script>
Hiç yorum yok:
Yorum Gönder