Making typeahead utf-8 friendly

[afridy]

Hi folks,

i am banging my head as i could get the typeahead to support Arabic. i have customers names in Arabic. but typeahead does not populate when i type. but for English names it works charm. can you kindly go though my code and help me meke it utf-8 ?

TYPEAHEAD JS

<script>
        var substringMatcher = function (strs) {
            return function findMatches(q, cb) {
                var matches, substringRegex;

                // an array that will be populated with substring matches
                matches = [];

                // regex used to determine if a string contains the substring `q`
                substrRegex = new RegExp(q, 'i');

                // iterate through the pool of strings and for any string that
                // contains the substring `q`, add it to the `matches` array
                $.each(strs, function (i, str) {
                    if (substrRegex.test(str)) {
                        // the typeahead jQuery plugin expects suggestions to a
                        // JavaScript object, refer to typeahead docs for more info
                        matches.push({
                            value: str
                        });
                    }
                });

                cb(matches);
            };
        };


        var names = [
            <?php
            
                $query = $db->query("SET NAMES 'utf8'");
                $query->execute();

                
                $query="SELECT * 
                        FROM customers
                        ORDER BY name";
                $query = $db->prepare($query);
                $query->execute();
                while($row = $query->fetch()){
                   $name=$row['name'];
                   echo "'" . $name . "',";
                }
                echo "];";
            ?>
            

        $('.typeahead').typeahead({
            hint: true,
            highlight: true,
            minLength: 1
        }, {
            name: 'names',
            displayKey: 'value',
            source: substringMatcher(names)
        });
</script>