Теме: Web развој

Пресловљавање имејл адресе у ћириличном веб обрасцу

Скраћена веза: http://pedja.supurovic.net/veza/4460

Откако је ћирилица послата лакше применљива на веб сајтовима појавио се нови проблем: неки подаци у веб обрасцима се обавезно морају уносити латиницом и то енглеском. Најбољи пример за то су имејл адресе.

Ово прави проблем кориснику који попуњава образац, јер он то чини ћирилицом, а онда наиђе на поље које дозвољава само енглеску латиницу. Тада мора да пребаци тастатуру на латиничну, унесе податак, затим врати ћириличну тастатуру и настави са уносом.

Можемо ли некако да олакшамо кориснику?

Ево једног могућег помагала: уместо да корисник пребацује тастатуру на латиницу, нека откуца адресу ћирилицом, а образац ће сам да преслови унети текст у латинични. Да се корисник не би збуњивао, ваља употребити JavaScript, тако да се пресловљавање изврши у тренутку док корисник укуцава адресу.

Прво, пољу у које се уписује имејл адреса подесићемо да се на onKeyUp догађај позове наша функција која ће извршити обраду.

<input name="email" type="text" onKeyUp="return keyupEmail(this)" />

Догађај onKeyUp се извршава када корисник пусти притиснути тастер. У овом примеру на тај догађај биће извршена функција keyupEmail(), којој ће бити прослеђен објекат поља (this).

Функција keyupEmail() је једноставна. Она узима вредност укуцаног знака и позива другу функцију, fix_email_chars(), која врши пресловљавање.

Функција fix_email_chars() као улазни параметар добија стринг који пресловљава а пресловљени стринг враћа као резултат. У нашем случају, функцији прослеђујемо један знак, онај који је управо откуцан.

Ово је све могло да се уради у једној функцији, али из практичних разлога, добро је да fix_email_chars() постоји као посебна функција јер се тако може употребити и у другим случајевима.

Функција fix_email_chars() је такође једноставна. Она садржи дефинисана два низа. Први, m_to_fix, садржи низ знакова који у имејл адреси нису дозвољени. Он садржи све ћириличне знакове и неколико наших латиничних знакова.



var m_to_fix = new Array ("а", "б", "в", "г", "д", "ђ",
"е", "ж", "з", "и", "ј", "к",
"л", "љ", "м", "н", "њ", "о",
"п", "р", "с", "т", "ћ", "у",
"ф", "х", "ц", "ч", "џ", "ш",
"А", "Б", "В", "Г", "Д", "Ђ",
"Е", "Ж", "З", "И", "Ј", "К",
"Л", "Љ", "М", "Н", "Њ", "О",
"П", "Р", "С", "Т", "Ћ", "У",
"Ф", "Х", "Ц", "Ч", "Џ", "Ш",
"š", "đ", "č", "ć", "ž", "Š",
"Đ", "Č", "Ć", "Ž");

Други низ, m_fixed, садржи одговарајуће знакове које треба уметнути уместо недозвољених. За сваки елемент у низу m_to_fix мора постојати одговарајући елемент у низу m_fixed.


var m_fixed = new Array ("a", "b", "v", "g", "d", "dj",
"e", "z", "z", "i", "j", "k",
"l", "lj", "m", "n", "nj", "o",
"p", "r", "s", "t", "c", "u",
"f", "h", "c", "c", "dz", "s",
"A", "B", "V", "G", "D", "DJ",
"E", "Z", "Z", "I", "J", "K",
"L", "LJ", "M", "N", "NJ", "O",
"P", "R", "S", "T", "C", "U",
"F", "H", "C", "C", "DZ", "S",
"s", "dj", "c", "c", "z",
"S", "D", "C", "C", "Z");

У примеру је ова функција коришћена замо за пресловљавање, али се променом дефиниције ова два низа лако може увести и забрана уноса неких знакова који никако нису дозвољени у имејл адресама, просто у низ m_to_fix упишете недозвољени знак а у низ m_fixed упишете да се тај знак замењује празним стрингом. Тако корисник неће моћи да укуца забрањени знак.

Могућа унапређења

Приметићете да функција fix_email_chars() ради тако што узме улазни стринг, вади један по један знак, тражи тај знак у низу m_to_fix, и ако га нађе, замени га одговарајућом вредношћу из низа m_fixed. Изабрао сам овај начин, зато што је у приеру циљ пресловљавање имејл адреса. Имејл адреса по правилу садржи мали број знакова, и то много мањи него што је број знакова који су забрањени, па је овај начин пресловљавања погодан и брз.

Међутим, ако би улазни стринг био дугачак текст, онда ово није оптималан начин конверзије, јер би за сваки знак у тексту била вршена претрага по низу m_to_fix, па чак и ако се исти знак много пута понавља. Тада би требало обрнути логику: кренути редом по низу m_to_fix и једним потезом вршити замену сваког знака из њега у целом тексту помоћу регуларних израза. То би било много брже. Најбоље би било направити комбинацију: проверити дужину улазног стринга и на основу ње одлучити који метод замене треба да се употреби.

Ова функција се даље може унапредити тако да као параметре добија и низове забрањених знакова и њихових замена, тако да јој се функционалност тиме значајно повећава, односно могу се примењивати различита пресловљавања према потреби, но ово је само једноставан пример, а ви га можете даље сами разрађивати.

Такође би требало решити и неке специфичности пресловљавања ћирилице у латиницу као што је пресловљавање почетног великог слова. Функција, каква је сада, о томе не води рачуна, јер то није потребно за имејл адресе.

Пример који ради

Како све ово ради можете погледати у функционалном примеру preslovljavanje_obrasca_primer.htm

Код сам испробао у фајерфоксу 3.6.6 и интернет експлореру 8. Требало би да ради и у свим другим веб читачима, па и оним старијим.


Поделите овај чланак са пријатељима


4 comments to Пресловљавање имејл адресе у ћириличном веб обрасцу

  • stanislav@letsdoitworld.org

    Postoji problem kada se dođe do @ jer se na ćiriličnom rasporedu kombinacijom shift 2 ne dobija majmunče nego navodnik. Zbog togaje opet potrebno promeniti raspored u ENG.

  • Није проблем у скрипти. Знак @ се на ћириличној тастатури обично добија на AltGr+V. Уколико то не ради, може се добити куцањем Алт+064 на нумеричкој тастатури.

  • Ћирилица1

    Па могао си и у овај коментар да уградиш овај јаваскрипт, да не мељам тастатуру при куцању овог коментара???

    Ево „процедура“ је уграђена на сајту Ћирилице Београд,
    као и конверзија наводника у @…

    Види и учлани се, или оснуј удружење Ћирилице у Ужицу???

    Поздрав,

    Ћирилица-Београд

    • Можда убацим код кад стигнем, сад имам превише других обавеза.

      Што се тиче удружења Ћирилица, моје поимање ћирилице се суштински разликује од оног које то удружење промовише, тако да тешко да ћете мене видети као члана, а поготово не као активисту.

Leave a Reply

 

 

 

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Попуните израз тако да буде тачан: *