Creating Multi-Language Custom Control
page 1 of 8
Published: 02 Jul 2008
Suppose that we are dealing with a multi-language website: English, French, Chinese, etc. and in some forms we need to enter a username in three languages, each language in a separate textbox. Abdulla's custom control allows developers to add these three textboxs inside a custom multilang control that will reform these textboxes inside a sliding div that displays one textbox at a time for the selected language. This custom control includes two icons for each language: one in "on" case, and one for "off" case, so the end user can click in the language image that he wants to enter and the proper textbox will appear in the sliding animation using JavaScript code. He provides a comprehensive explanation of each step involved in developing the control with source codes and screenshots in addition to some of the tips and tricks for advanced functionality.
by Abdulla Hussein AbdelHaq
Average Rating: 
Views (Total / Last 10 Days): 34988/ 41


Sometimes, when you are browsing on a global website that has multi-languages, multi-interfaces and a lot of fields for each culture that change direction and language of the page depending on some culture, you have to enter some text in multi-language. For example, you want to create an account in a registration form and they recommend you enter your name in English, French and Arabic. In that case we will have three Textboxes under each other - Textbox for each language.

For now, three textboxes seem fine to the layout of the page and to the end-user, but suppose that there are more fields in the page that need to be entered in three languages! What if there are four more fields? In that case we will have 15 textboxes in the page, so the layout will not be developed in a professional way and also will not be user-friendly.

In this article, I am going to illustrate how to create a custom multi-language control that collapses the three textboxes into one control that will display one textbox every time, and this will result in using four Textboxes instead of 15 Textboxes. Also, this control will include an image for each language that enables the end-user to select the language he wants, with a great sliding JavaScript animation, and to show all languages with JavaScript sliding animation too.

Throughout this article we are going to customize three languages: English, Arabic and French.

How flexible is it?

Generally, custom controls should be flexible to be more reusable, and it should allow the page developer to customize the control depending on some cases. Because of that, this custom control will contain a lot of properties that allow the page developer to change and hide such images and texts, determine the type of control to be displayed (textbox or textarea) and control which language to be displayed.

Also, page developer can set a CssClass for the labels and textboxes.

I will talk more about these properties later in this article.

Note: I supposed that you have a background about creating custom controls, so I will not go into detail about creating custom controls.

View Entire Article

User Comments

Title: Good Article   
Name: Vagueraz
Date: 2008-07-04 5:03:31 AM
Very Good and Strong Article , and it's not only useful for devlopers also for end-users ....
Title: Outstanding Work   
Name: Jean-Pierre Jamous
Date: 2008-07-02 10:01:11 PM
Extremely nice. It comes handy for developers. You've done a tremendous job at it. Keep up the great work.
Title: Very good article   
Name: Anas al-qudah
Date: 2008-07-02 4:03:52 AM
It's realy Very good article and help me.
Thanks thanks alot.

Product Spotlight
Product Spotlight 

Community Advice: ASP | SQL | XML | Regular Expressions | Windows

©Copyright 1998-2024  |  Page Processed at 2024-04-14 1:29:04 AM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search