ASP.Net- Create Hindi TextBox Using Google Transliteration in ASP.Net

Here, I am explaining you how to create a hindi textbox in ASP.Net using Google Transliteration.Here I am mainly targeting english to hindi transliteration. You can use any language which is supported by Google.

In my previous posts, I explained Send mail in ASP.Net, Convert DataTable into List, Constructor Chainning in C#, Convert a Generic List to a Datatable, Get Property Names using Reflection in C#, Hard drive information using C#, Create Directory/Folder using C#, Check Internet Connection using C#, SQL Server Database BackUp using C# and some other articles related to C#, ASP.Net, jQuery, Java Script and SQL Server.

To create a Hindi textbox in ASP.Net using Google Transliteration, you have to add the following script source into your ASPX page.

<script src="https://www.google.com/jsapi"
type="text/javascript">
</script>

After adding above script source file, Now write the following java script.

<script language="javascript" type="text/javascript">
google.load("elements", "1", {packages: "transliteration"});
      
function onLoad() {
 var options = {
    //Source Language
    sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
    // Destination language to Transliterate
    destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
    shortcutKey: 'ctrl+g',
    transliterationEnabled: true
 };
      
    var control = new google.elements.transliteration.TransliterationControl(options);
    control.makeTransliteratable(['YourTextBoxClientID']);
     
}
google.setOnLoadCallback(onLoad);
</script>

Here is the full ASPX page code-
Aspx Page

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="MultiPagetoPdf.WebForm1" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Hindi Textbox Demo</title>
   <script src="https://www.google.com/jsapi" type="text/javascript">
    </script>
    <script language="javascript" type="text/javascript">
        google.load("elements", "1", { packages: "transliteration" });
 
        function onLoad() {
            var options = {
                //Source Language
                sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
                // Destination language to Transliterate
                destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
                shortcutKey: 'ctrl+g',
                transliterationEnabled: true
            };
 
            var control = new google.elements.transliteration.TransliterationControl(options);
            control.makeTransliteratable(['TextBox1']);
 
        }
        google.setOnLoadCallback(onLoad);
</script>
</head>
<body>
    <form id="form1" runat="server">
   <div>
    <asp:textbox id="TextBox1" runat="server" style="border: 1px solid black; height: 125px; margin-left: auto; width: 550px;" textmode="MultiLine">
</div> 
</form> 
</body> 
</html>

Live Demo

I hope you enjoyed this post. I would like to have any feedback from you. Your valuable feedback, question, or comments about this article are always welcome.

Dot Net World

Pages

Thursday, May 16, 2013

ASP.Net- Create Hindi TextBox Using Google Transliteration in ASP.Net

No comments:

Post a Comment