Ability to search from the keyboard with different character encodings

I have a select tag that has options in Georgian:

<select>
    <option value="1"> პირველი </option>
    <option value="2"> მეორე </option>
    <option value="3"> მესამე </option>
</select>

When I expand the select tag and press "მ" on the keyboard, I want to find the search option starting with "მ". Everything works fine by default when characters are written in English. I do not know how to fix this, can you suggest something?

+5
source share
1 answer

I do not have Georgian characters on my keyboard, but at least I know Russian:

HTML:

<select id="select">
    <option value="0"></option>
    <option value="1"></option>
    <option value="2"></option>
    <option value="3"></option>
    <option value="4"></option>
    <option value="5"></option>
    <option value="6"></option>
    <option value="7"></option>
    <option value="8"></option>
    <option value="9"></option>
</select>

JS:

document.getElementById('select').addEventListener('keypress', function (event) {
    var length = this.options.length;
    var char = String.fromCharCode(event.which);
    var keys = {
        a: '',
        b: '',
        c: '',
        d: '',
        e: '',
        f: '',
        g: '',
        h: '',
        i: '',
        j: '',
        k: '',
        l: '',
        m: '',
        n: '',
        o: '',
        p: '',
        q: '',
        r: '',
        s: '',
        t: '',
        u: '',
        v: '',
        w: '',
        x: '',
        y: '',
        z: '',
        '[': '',
        ']': '',
        ';': '',
        '\'': '',
        ',': '',
        '.': '',
        '/': '.',
    };
    var key = keys[char];
    for (var i = 0; i < length; i++) {
        if (this.options[i].innerHTML.charAt(0).toLowerCase() === key) {
            this.selectedIndex = i;
            break;
        }
    }
});

And a working example: http://jsfiddle.net/wdSQv/1/ (tested in Firefox 20)

+1
source

All Articles