change input text language at focus if rtl

Question

please i need when start typing inside the input to change the language for user automatically to Arabic instead of English depending on css condition like if text-align:rightor 'direction:rtl.

i found the below script to do that but as i'm beginner i can't modifying it to working with my input text below or any other input.

function convert2Ar(id, lang) {
    if (lang == 'ar') {
        var convert = true;
        var selectall = false;
        var cursorindx = 0;

        $('#' + id).bind('keydown', function (e) {
            if (e.shiftKey && e.altKey) {
                convert = false;
            }
            if (e.keyCode == 65 && e.ctrlKey) {

                selectall = true;

            }
        });

        $('#' + id).bind('keypress', function (e) {
            if (selectall) {
                this.select();
                selectall = false;
            }
            else if (e.keyCode != 8 && e.which != 0 && convert) {
                console.log(e.keyCode);
                e.preventDefault();
                cursorindx = this.selectionStart;
                var txt = $(this).val();
                txt = txt.substring(0, this.selectionStart) + char2Ar(String.fromCharCode(e.which), e) + txt.substring(this.selectionEnd, txt.length);
                $(this).val(txt);

                this.selectionStart = cursorindx + 1;
                this.selectionEnd = cursorindx + 1;
            }
        })
    }
}

function char2Ar(c, e) {
    if (e.keyCode != 16 && e.keyCode != 18) {
        var letter = c;
        if (e.shiftKey) {
            switch (c) {
                case "A": letter = "ِ"; break;
                case "B": letter = "لآ"; break;
                case "C": letter = "}"; break;
                case "D": letter = "]"; break;
                case "E": letter = "ُ"; break;
                case "F": letter = "["; break;
                case "G": letter = "لأ"; break;
                case "H": letter = "أ"; break;
                case "I": letter = "÷"; break;
                case "J": letter = "ـ"; break;
                case "K": letter = "،"; break;
                case "L": letter = "/"; break;
                case "M": letter = "’"; break;
                case "N": letter = "آ"; break;
                case "O": letter = "×"; break;
                case "P": letter = "؛"; break;
                case "Q": letter = "َ"; break;
                case "R": letter = "ٌ"; break;
                case "S": letter = "ٍ"; break;
                case "T": letter = "لإ"; break;
                case "U": letter = "‘"; break;
                case "V": letter = "{"; break;
                case "W": letter = "ً"; break;
                case "X": letter = "ْ"; break;
                case "Y": letter = "إ"; break;
                case "Z": letter = "~"; break;
                case "?": letter = "؟"; break;
                case "~": letter = "ّ"; break;
            }
        }

        else {
            switch (c) {
                case ";": letter = "ك"; break;
                case "a": letter = "ش"; break;
                case "b": letter = "لا"; break;
                case "c": letter = "ؤ"; break;
                case "d": letter = "ي"; break;
                case "e": letter = "ث"; break;
                case "f": letter = "ب"; break;
                case "g": letter = "ل"; break;
                case "h": letter = "ا"; break;
                case "i": letter = "ه"; break;
                case "j": letter = "ت"; break;
                case "k": letter = "ن"; break;
                case "l": letter = "م"; break;
                case "m": letter = "ة"; break;
                case "n": letter = "ى"; break;
                case "o": letter = "خ"; break;
                case "p": letter = "ح"; break;
                case "q": letter = "ض"; break;
                case "r": letter = "ق"; break;
                case "s": letter = "س"; break;
                case "t": letter = "ف"; break;
                case "u": letter = "ع"; break;
                case "v": letter = "ر"; break;
                case "w": letter = "ص"; break;
                case "x": letter = "ء"; break;
                case "y": letter = "غ"; break;
                case "z": letter = "ئ"; break;
                case ",": letter = "و"; break;
                case ".": letter = "ز"; break;
                case "/": letter = "ظ"; break;
                case "`": letter = "ذ"; break;
                case "'": letter = "ط"; break;
                case "[": letter = "ج"; break;
                case "]": letter = "د"; break;
            };

        }
        return letter;
    }
}

<input type="text" id="txt_MenuSearch" class="search-input ui-autocomplete-input" placeholder="search here.." autocomplete="off">

Is this your actual code? you are not calling the `convert2Ar` function. — Spoody, Jul 16 '18 at 18:47
@Mehdi script is not my code and i don't know how to call it in my input when typing .. sorry as i'm beginner on this :) — Muhammad S. Eltyar, Jul 16 '18 at 20:06

score 1 · Accepted Answer · answered Jul 17 '18 at 11:30

1

What I meant is your code is a function, it needs to be called like this:

convert2Ar('txt_MenuSearch', 'ar');

But the whole idea is weird for me, what are you trying to achieve? why not let the user change his keyboard layout?

Here is a fiddle

answered Jul 17 '18 at 11:30

Spoody

2,852
1
26
36

it's not working @Mehdi .. the reason is because the area (pages) they will search for, all of them in one language "Arabic" :) – Muhammad S. Eltyar Jul 17 '18 at 18:19
@MuhammadS.Eltyar Yes but the user is capable of changing his input language using his OS settings. And what do you mean by not working? the fiddle is working fine. – Spoody Jul 17 '18 at 19:21
thank you very much, it's working now after putting the script of the bottom of page :) – Muhammad S. Eltyar Jul 17 '18 at 21:45

score 0 · Answer 2 · answered Jul 16 '18 at 18:44

0

I think its already answered here.

Right to left Text HTML input

Like told there,you dont need javascript for that. You can just set dir="rtl" to the input itself for that

answered Jul 16 '18 at 18:44

Kiran Sripada

9
2

this's not what i need, it's working with cursor direction, i need to change the language to Arabic instead of English when typing – Muhammad S. Eltyar Jul 16 '18 at 18:56
you mean to change the keyboard input language? i think we can give lang attribute to the input element but we have to see if it works. – Kiran Sripada Jul 16 '18 at 19:27
please explain more as i'm beginner on this ? – Muhammad S. Eltyar Jul 16 '18 at 20:07
I was saying you can set lang attribute like – Kiran Sripada Jul 16 '18 at 20:13

change input text language at focus if rtl

2 Answers2