Making your ASP.NET/HTML Websites Indic aware – accepting Tamil, Telugu, Kannada, Hindi and ot
- by Harish Ranganathan
Its been a month since I wrote my last post. Much of work has been happening around planning for Tech Ed India, the upcoming Virtual TechDays this week as well as our Developer content at the Great Indian Developer Summit 2010. Its going to be one exciting period starting this week and I am glad I would be able to meet a lot of folks who have written to me personally that they would like to catch up at Tech Ed India. For now, I had a chance to meet the Microsoft India Development Centre team that worked on the Microsoft Indic Language Input Tool (erstwhile Akshara). The team updated me that they have also released the scripts so that the Indic input feature can be encapsulated into your own websites. For example, if you are having a web page where you collect user information, you can pretty much make your site indic aware i.e. accept inputs in Tamil, Telugu, Kannada, Hindi etc., All you would need to include would be a bunch of scripts onto your web pages and you are ready to make it, like I said, “indic aware” I have built a sample web page that accepts First Name, Last Name, Address and an additional field. When it comes to accepting indic, sometimes, you may want to avoid the indic input in certain fields and accept it in English. You can specify the MicrosoftILITWebAttach="false" attribute to the Text Boxes and Text Areas (TextMode=”Multiline” in ASP.NET) so that the particular field automatically switches over to English input. Similarly, the moment you specify that the TextMode=”Password” to make it as a password field, it automatically ignores all indic recognition and shows the masked dots for the words entered. Note that, this is, when we are going for the Opt-out mode, where we are specifying that by default all the input controls would need indic awareness and we would specify for those controls where it is not required. The other mode is Opt-in mode where you would need to add a different property to the script definition i.e. attachMode=”optin” . When we do this, we need to explicitly add the MicrosoftILITWebAttach="true" attribute for every control where we need indic input. I have created a sample web page which accepts First Name, Last Name, Address and an additional input field to demonstrate the “Opt-out”. You can copy paste this into any of your web pages to check it <form id="form1" runat="server"> <!-- Microsoft Indic Language Input Tool embed code --> <input type="hidden" id="MicrosoftILITWebEmbedInfo" attachMode="optout" value="" /> <script type="text/javascript" src="http://ilit.microsoft.com/bookmarklet/script/Tamil.js" defer="defer"></script> <div> <h2> Welcome to the Registration Page </h2> <p> First Name: <asp:TextBox runat="server" ID="txtFirstName" /> <br /> <br /> Last Name: <asp:TextBox runat="server" ID="txtLastName" /> <br /> <br /> Password: <asp:TextBox runat="server" ID="txtPassword" TextMode="Password" /> <br /> <br /> Address: <asp:TextBox runat="server" ID="txtAddress" TextMode="MultiLine" Height="100" Width="200" /> <br /> <br /> English Text: <asp:TextBox ID="txtEnglishText" runat="server" MicrosoftILITWebAttach="false" /> </p> <p> <!-- Microsoft Indic Language Input Tool attribution image link --> <a style="text-decoration: none" href="http://go.microsoft.com/fwlink/?LinkID=184205&clcid=0x409"><img style="border: 0px" alt="Transliteration by Microsoft" src="http://ilit.microsoft.com/bookmarklet/images/attribution.png"></a> </p> </div> </form> If you note the code snippet above, I have included the scripts in the top with the attachMode set to “optout” and for the last TextBox, I have mentioned the MicrosoftILITWebAttach="false” attribute to make it accept English input. Additionally, you also need to add the “Microsoft Indic Language Input Tool attribution image” to your web page as a courtesy to the team that developed this feature. It would basically add a image saying “Transliteration by Microsoft” similar to a Copy Right image. You can see the screen shot below where I have typed it in Tamil. In that you will notice that the password field behaves as expected and the last field accepts English Text. You can also notice the icon that comes in the first textbox that indicates that, the field is going to accept indic text. This sample is using Tamil, but you can pretty much do it for Hindi, Telugu, Kannada, Marathi, Bengali etc., The website for getting the Indic script and other instructions is http://specials.msn.co.in/ilit/WebEmbed.aspx?language=Tamil You can replace the querystring value “Tamil” to other languages as mentioned above to get the respective script. This also works for plain HTML based websites and doesn’t necessarily need you to use ASP.NET to achieve the functionality. Note that, this form is not completely localized. This is transliterated. You can add label controls for FirstName, LastName indication etc., and use the Visual Studio tools to localize and get those values from resource files. In the resource files, you can enter the text in different languages to make this a truly localized page. If you just want to download the Indic Tool Desktop version (that can be used for typing in Word, Excel, pretty much any input area), you can download it from http://specials.msn.co.in/ilit/ In the same page, there is also a web version where you can type and get text then and there if you dont want to install the desktop version. So, go ahead, download / use them in your websites and enjoy the power of Indic. Cheers !!!
