Click here to Skip to main content
13,150,163 members (77,527 online)
Click here to Skip to main content
Add your own
alternative version


33 bookmarked
Posted 23 Mar 2010

Hindi/Marathi Transliteration ASP.NET Custom Control

Rate this:
Please Sign up or sign in to vote.
Creating a Hindi Transliteration Control in ASP.NET using Google transliteration API


What is an ASP.NET Custom Control

In contrast to a user control, a custom control is boiled down into one compiled class. The interface (HTML and JavaScript) is written out programmatically instead of being visually created in an IDE. You can blend the richness of the .NET programming model in your code with as complex of an interface as need be. Because a custom control is contained in a class, you have access to all the functionality of the .NET Framework, properties can be defined, and functions can be implemented. In fact, the server controls that ship with ASP.NET and Visual Studio.NET are in essence, custom controls. They are compiled classes that when placed on a page, interact with each other, interact with the page (take advantage of events like OnLoad), emit HTML and script, and provide the power behind the ASP.NET technology.

The only difference between Microsoft's pre-built server controls and our custom controls is that they are pre-registered in the IDE for use (the System.Web.dll file is registered in the toolbox), and references in the HTML are implied (as discussed with user controls). Obviously, Microsoft's controls are very well thought out and are designed to work together efficiently. For instance, the SQLDataAdapter, DataSet, and DataGrid controls work very closely with each other. Your custom controls are more likely to focus on one particular piece of functionality and not worry about interaction to this degree. So let's get down to building our control, registering it with the IDE for use (we will even define an icon for use in the toolbox), and placing the control on a page for rendering.

Here is the custom control built which uses the Google transliteration API and Keyboard API for transliterating the text from English to Hindi.

Creating a Hindi Transliteration Control in ASP.NET using Google transliteration API.</strong />

The complete source of the customcontrol is included along with the DLL in the bin.

Note: This control uses the Google transliteration API , so Internet connection is required to access the Google JavaScript libraries.

Using the Google transliteration API to Create a Transliteration Server Control in ASP.NET

You can use the control on a page. Open a new instance of the VS.NET IDE, click the New Project button, and select an ASP.NET Web Application in the Visual C# Projects folder. Name the project "UsingTransliteration" and click OK. The IDE will create a new Web project.

We now want to register our control in the toolbox, so we can simply drag it onto the designer. Right-click on the toolbox and select Customize Toolbox. Select the .NET Components tab (since our control is a .NET assembly, not a COM component) and click the Browse button. Navigate to the "TransliterateTextboxControl" project that we created and drill down into the bin/debug folder (if you built our custom control project in "release" configuration, you will see a "release" folder also). There you should find our TransliterateTextboxControl.dll component. Select the TransliterateTextboxControl.dll file and click OK. You should now see our control with our custom icon in the toolbox.

Drag the control on the body of the open Web form and click View In Browser. You should get a parser error stating that one of the dependencies was not found. This is because while we added the control to the toolbox, the code is unreachable by the CLR. We must set a reference to the component in our project and import the class. To do this, right-click on the References folder in the solution explorer and click Add Reference. The displayed list shows .NET components that are recognized by the IDE. Our component is not in this list yet, so click on the Browse button. Again, find the .NET component called TransliterateTextboxControl.dll that we discussed earlier. Click Open, click OK. We now have a reference to our control in the References folder. Refresh the browser see if the control renders (there is no need to recompile since the control is already compiled into a DLL file).

In the .aspx file, it will look somewhat like this:

<%@ Register Assembly="TransliterateTextboxControl"

	Namespace="TransliterateTextboxControl" TagPrefix="cc1" %>

<cc1:TransliterateTextbox ID="TransliterateTextbox1"

	runat="server" EnableKeyboard="true" KeyboardLayout="GUJARATI_PHONETIC" 

	DestinationLanguage="HINDI" Height="84px" Width="501px" Text="">

DestinationLanguage :: The destination Transliteration language is also made configurable, so you can select between the following supported transliterating languages.


KeyboardLayout :: Also if the virtual keyboard is enabled, you can configure the layout of the virtual keyboard to the following possible layouts.


Now you can use the control as normal textbox as it inherits all the members of the basic textbox control in ASP.NET.

You can also dynamically create an instance of TransliterateTextbox.

// TransliterateTextboxControl.TransliterateTextbox TT =
// new TransliterateTextboxControl.TransliterateTextbox();

You can get the transliterated text by:

// string transliteratedText = TT.Text;

You can enable/disable the transliteration by pressing Ctrl+g.

You can also show/hide the virtual keyboards by pressing Ctrl+m.

We can also have multiple instances of this control on the same page, each with different destination transliterating languages and different Virtual Keyboard layouts.

The layout of the virtual keyboard will change respectively on focus of each textbox.

Points of Interest

The reason the control wasn't working for multiple instances was that every time a new control was instantiated, the JavaScript registered for the previous instance was overridden.

To resolve the problem, I selected the way to concatenate the script identifier and the independent JavaScript functions with the clientID of the control.

init_script.Append("function OnLoad_" + this.ClientID + "() {");
	"init_" + this.ClientID,init_script.ToString(), true);

So the overriding of the appended JavaScript and the ClientScriptManager generated JavaScript was avoided.

You can also easily make this code configurable to operate with different languages for transliteration. In a similar way, we can also create the translation control using the Google API for translation.

Thanks to Google.....

The next update for this control will be making the languages configurable... ... keep a watch! You can easily make the languages configurable by adding a property in the control and appending the related language code to the API function.


After a long gap, I was again able to devote some time this month for the enhancement of this control.

This is a update to my previous article.The major updates include:

  1. Fixed the issue of multiple instances of control on the same page
  2. Added the provision for onscreen virtual keyboard
  3. Made the Destination transliteration language configurable
  4. Provision for configurable virtual keyboard layout


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Nozel Rosario : 4583847
Software Developer (Senior)
India India
function Nozel_Rosario(Imagination, Creativity, Computer_Programming) {
var Innovation = Imagination + Creativity * Computer_Programming ;
return Innovation;

You may also be interested in...


Comments and Discussions

PraiseThanks for Transliteration DLL Pin
avi_bhagat4-Jun-17 20:00
memberavi_bhagat4-Jun-17 20:00 
QuestionDoes it work without internet connection? Does google transliteration API is free of cost? Pin
sachin shelake5-Feb-15 3:36
membersachin shelake5-Feb-15 3:36 
QuestionVery nice. Thank you very much. i have one doubt please help me.. Pin
arulb2w12-Jul-14 2:21
memberarulb2w12-Jul-14 2:21 
AnswerRe: Very nice. Thank you very much. i have one doubt please help me.. Pin
Nozel Rosario : 458384712-Jul-14 8:58
memberNozel Rosario : 458384712-Jul-14 8:58 
GeneralRe: Very nice. Thank you very much. i have one doubt please help me.. Pin
arulb2w13-Jul-14 20:14
memberarulb2w13-Jul-14 20:14 
QuestionEnable transliteration Pin
ritzshaani3-Mar-14 0:25
memberritzshaani3-Mar-14 0:25 
QuestionIntegration with CKEditor Pin
ShailendraP12-Sep-13 21:25
memberShailendraP12-Sep-13 21:25 
AnswerRe: Integration with CKEditor Pin
Nozel Rosario : 458384719-Sep-13 22:57
memberNozel Rosario : 458384719-Sep-13 22:57 
QuestionRegarding Offline Mode Pin
jasbir singh Rana3-Sep-13 0:47
memberjasbir singh Rana3-Sep-13 0:47 
AnswerRe: Regarding Offline Mode Pin
Nozel Rosario : 458384719-Sep-13 23:01
memberNozel Rosario : 458384719-Sep-13 23:01 
Questioncan we use in vb for standalone ?? Pin
yogeshbombe6-Aug-13 3:54
memberyogeshbombe6-Aug-13 3:54 
Questionwhy is the id name of control shown in textbox...cant i get empty textbox to start with? Pin
vish270300721-Feb-13 0:44
membervish270300721-Feb-13 0:44 
Questiontype in 2 text boxes simultaneously Pin
shreya2821-Jan-13 0:10
membershreya2821-Jan-13 0:10 
QuestionWorking only once in UpdatePanel Cpntrol Pin
Prashant Acharya28-Nov-12 7:53
memberPrashant Acharya28-Nov-12 7:53 
GeneralMy vote of 4 Pin
D-Kishore4-Sep-12 0:53
memberD-Kishore4-Sep-12 0:53 
QuestionThank and i have QQQQQ? Pin
india_team29-May-12 23:31
memberindia_team29-May-12 23:31 
AnswerRe: Thank and i have QQQQQ? Pin
Nozel Rosario : 458384729-May-12 23:50
memberNozel Rosario : 458384729-May-12 23:50 
QuestionNot working in some standard asp control Pin
andiruddha9-May-12 3:17
memberandiruddha9-May-12 3:17 
AnswerRe: Not working in some standard asp control Pin
Nozel Rosario : 458384729-May-12 23:59
memberNozel Rosario : 458384729-May-12 23:59 
GeneralMy vote of 5 Pin
manoj kumar choubey3-Feb-12 19:25
membermanoj kumar choubey3-Feb-12 19:25 
Questionbugs in the control or google updated?? Pin
cingo2-Jan-11 7:50
membercingo2-Jan-11 7:50 
AnswerRe: bugs in the control or google updated?? Pin
cingo2-Jan-11 7:59
membercingo2-Jan-11 7:59 
GeneralRe: bugs in the control or google updated?? Pin
Nozel Rosario : 45838472-Jan-11 18:18
memberNozel Rosario : 45838472-Jan-11 18:18 
QuestionHow can I paste the contents copied from an external .pdf or .pm5 file? Pin
Member 407255825-Oct-10 0:12
memberMember 407255825-Oct-10 0:12 
GeneralMy vote of 5 Pin
S M P7-Oct-10 4:20
memberS M P7-Oct-10 4:20 
GeneralRe: My vote of 5 Pin
Nozel Rosario : 458384717-Oct-10 1:31
memberNozel Rosario : 458384717-Oct-10 1:31 
GeneralMy vote of 5 Pin
mamta_m_d6-Oct-10 19:12
membermamta_m_d6-Oct-10 19:12 
GeneralRe: My vote of 5 Pin
Nozel Rosario : 458384717-Oct-10 1:30
memberNozel Rosario : 458384717-Oct-10 1:30 
Generalhey its really nice work!!! Pin
danny33317-Sep-10 17:58
memberdanny33317-Sep-10 17:58 
GeneralRe: hey its really nice work!!! Pin
Nozel Rosario : 45838474-Oct-10 10:57
memberNozel Rosario : 45838474-Oct-10 10:57 
GeneralMy vote of 3 Pin
Member 282711520-Aug-10 4:33
memberMember 282711520-Aug-10 4:33 
GeneralRe: My vote of 3 Pin
Nozel Rosario : 458384715-Sep-10 11:48
memberNozel Rosario : 458384715-Sep-10 11:48 
GeneralThanks Pin
prashant satpute2-Apr-10 19:07
memberprashant satpute2-Apr-10 19:07 
GeneralExcellent!! Need help Pin
Ram Kandimalla28-Mar-10 18:15
memberRam Kandimalla28-Mar-10 18:15 
Generalthanks Pin
Nitin Sawant26-Mar-10 0:18
memberNitin Sawant26-Mar-10 0:18 
GeneralGood work! Pin
Sandeep Mewara23-Mar-10 19:48
memberSandeep Mewara23-Mar-10 19:48 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170924.2 | Last Updated 6 Oct 2010
Article Copyright 2010 by Nozel Rosario : 4583847
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid