I am using google translator API to get regional language input in my website (which is responsive). It suppose to translate each word after pressing space, this works fine on desktop browsers even in chrome. It also works fine on Android Default Browser and other Android browsers. But when using same on Android Chrome Browser translator didn't respond on space but surprisingly if I press go or new line on keyboard it translates word. I don't understand why this is happening. And how to control it.
What I have tried:
google.load("elements", "1", {
packages: "transliteration"
});
function onLoad() {
var options = {
sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
shortcutKey: 'ctrl+g',
transliterationEnabled: true
};
if (google.elements.transliteration.isBrowserCompatible()) {
var control = new google.elements.transliteration.TransliterationControl(options);
control.makeTransliteratable(['transliterateTextarea']);
document.getElementById('errorDiv').innerHTML = 'Supported';
} else {
document.getElementById('errorDiv').innerHTML = 'Sorry! Your browser does not support transliteration';
}
}
google.setOnLoadCallback(onLoad);
<div class="Google-transliterate-Way2blogging">
Type in Hindi (Press Ctrl+g to toggle between English and Hindi)<br>
<textarea id="transliterateTextarea" style="width:600px;height:200px"></textarea>
<span style="font-weight:bold;font-size:10px;float:right;margin:5px;"></span>
<span id="errorDiv"></span>
</div>