You can do this by implementing concept of localization and globalization.
Globalization is process of making an application automatically handle users from different countries and locales.
Localization is process of providing “localized resources” to make an application usable for different countries and locales.
In Localization Application author has to provide the resources like text in different languages for labels, buttons and other controls.
Example: In order to use your web page or site by international users it must be translated to multiple languages, FW would not transform the text automatically; you need to provide the translations.
Globalization in ASP.NET AJAX
In ASP.NET AJAX, script manager control is going to support Globalization by setting the “EnableScriptGlobalization = true” it automatically formats the dates and currencies based on culture.
You can set culture in following ways
· Set Programmatically
· Set at Page level
· Set in the Web.config file
If it is not set anywhere above then it can be determined from client side ACCEPT-LANGUAGE header which comes from the client browser.
Localization in ASP.NET AJAX
Localization is also relies on Script Manager control and uses the Culture UI setting and you need to set the “EnableScriptLocalization = true”
Use scripts element to identify the localized scripts by using the ResourceCultures attribute.
Script Manager will insert locale info into filename:
- 1. Open Visual Studio 2010 and create a new ASP.NET
- http://dotnetsizzler.com/image.axd?picture=image_10.png
2. Drag the Script Manager control to default.aspx page and set the EnableScriptGlobalization attribute to “true”. By default the value is false
<asp:ScriptManager ID="ScriptManager1"
EnableScriptGlobalization="true"
runat="server">
</asp:ScriptManager>
3. Now add a hyperlink and write a JavaScript function to update the UI in default web page
<a id="updateLink" href="javascript:updateUI()">
UpdateUI</a>
<script type="text/javascript">
function updateUI() {
cultureDiv.innerHTML = Sys.CultureInfo.CurrentCulture.name;
var cur = 15.65;
currencyDiv.innerHTML = String.localeFormat("{0:c}", c);
var d = new Date();
TimeDiv.innerHTML = d.localeFormat("dddd dd MMM yyyy HH:mm:ss");
}
</script>
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
4. Add some HTML content to page as shown below
<p/>
Current Culture(client):
<div id="cultureDiv" style="font-weight:bold"></div>
<p/>
Currency:
<div id="currencyDiv" style="font-weight:bold"></div>
<p/>
Time:
<div id="TimeDiv" style="font-weight:bold"></div>
5. Now run the application and click the updateUI link to see the following window. It shows the current culture, currency and time.
http://dotnetsizzler.com/image.axd?picture=image_11.png
6. In order to get the appropriate culture and currency that browser using then you need to set the following attribute in web.config file so that the values change based on the culture setting in the browser.
<globalization culture ="auto"/>
7. If you want to control the culture from server side, just mention the desired culture in web.config file
<globalization culture ="es-ES"/>
http://dotnetsizzler.com/image.axd?picture=image_12.png
8. You can override the culture setting at page level by changing the culture attribute in page directive.
<Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master"
AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="GlobalizationSample._Default"
Culture="it-IT" %>
9. We can override these values by writing the following code in code behind
protected override void InitializeCulture()
{
this.Culture = "it-IT";
}
Localization Example
1. Now add a javascript file named Localization.js to your scripts folder and write the following code in the script file
1: Sys.Application.add_load(SetLocalizedInfo);
2: function SetLocalizedInfo() {
3: $get("updateLink").innerHTML = Messages.UpdateLinkText;
4: }
5: Messages = {
6: "UpdateLinkText": "Update Eng UI"
7: };
The above script sets the link text to “Update Eng UI” while you call this in script manager
2. Similarly add the Localization.it-IT.js and Localization.sv-SE.js script files in solution as shown in below
http://dotnetsizzler.com/image.axd?picture=image_13.png
The script files will be download to the client based on UI culture that you set in your application
Refer the above script in page as follows
<asp:ScriptManager ID="ScriptManager1" EnableScriptGlobalization="true"
EnableScriptLocalization ="true" runat="server">
<Scripts>
<asp:ScriptReference Path="~/Scripts/Localization.js"
ResourceUICultures ="it-IT;sv-SE" />
</Scripts>
3. Write the following code in code behind
protected void Page_Load(object sender, EventArgs e)
{
//seeting the current culture to UI culture
Thread.CurrentThread.CurrentUICulture = Thread.CurrentThread.CurrentCulture;
}
protected override void InitializeCulture()
{
this.Culture = "it-IT";
}
Respective culture that you set will be loaded from scripts folder and ui elements will be changed accordingly.
for more detail follow this link-
http://www.dotnetsizzler.com/post/2011/01/03/Globalization-and-Localization-with-ASPNET-AJAX.aspx