I implemented the use of a text box with ajaxtoolkit HtmlEditorExtender (Rich textbox) to translate English to Gujarati using Google translation Javascript. The translation function works perfectly with the regular text box, but encounters issues when used with the HtmlEditorExtender.
Here is the snippet of Javascript code I utilized for this functionality:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("elements", "1", {
packages: "transliteration"
});
function onLoad() {
var options = {
sourceLanguage:
google.elements.transliteration.LanguageCode.ENGLISH,
destinationLanguage:
google.elements.transliteration.LanguageCode.GUJARATI,
shortcutKey: 'ctrl+g',
transliterationEnabled: true
};
var control =
new google.elements.transliteration.TransliterationControl(options);
control.makeTransliteratable(['<%=TextBox1.ClientID%>']);
}
google.setOnLoadCallback(onLoad);
var finalString = "";
function Changed(textControl) {
var _txtUnicodeName = document.getElementById('<%=TextBox1.ClientID%>');
var _EnteredString = _txtUnicodeName.value;
}
</script>
<asp:UpdatePanel ID="Activistupdatepanel" runat="server">
<ContentTemplate>
<div>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<ajaxtoolkit:HtmlEditorExtender ID="htmlEditorExtender1" TargetControlID="TextBox1"
runat="server" EnableSanitization="False" Enabled="True">
</ajaxtoolkit:HtmlEditorExtender>
</div>
</ContentTemplate>
</asp:UpdatePanel>