LanceZhang’s Blog

Dear friends, Welcome to my blog.

How to change the Culture of CalendarExtender programmatically

Based on my knowledge, the CalendarExtender’s language is based on the “Sys.CultureInfo.CurrentCulture.dateTimeFormat”, all of the primary function “_buildDays” “_buildMonths”  “_performLayout”  “_getFirstDayOfWeek” use the “Sys.CultureInfo.CurrentCulture.dateTimeFormat”.

So, if we need change the language or culture of CalendarExtender, we need to change the “Sys.CultureInfo.CurrentCulture.dateTimeFormat”.

There are two ways can change the “Sys.CultureInfo.CurrentCulture.dateTimeFormat”:

1. Change the CurrentCulture in code-behind, by the following code: 

protected void Page_Load(object sender, EventArgs e)
{
    string Lang = “ro-RO”;//set your culture here
    System.Threading.Thread.CurrentThread.CurrentCulture =
        new System.Globalization.CultureInfo(Lang);
}

If you add the following code to your page, and set the EnableScriptGlobalization=”true” to your ToolkitScriptManager or ScriptManager, the language and culture of CalendarExtender will be “ro-RO” (more culture symbol, please visit: http://msdn.microsoft.com/en-us/library/system.globalization.cultureinfo(VS.80).aspx)

2. Change the Sys.CultureInfo.CurrentCulture.dateTimeFormat by JavaScript, and then, dispose and recreate the CalendarExtender.

<script type=“text/javascript”>

    function pageLoad(sender, args) {

        //Step1:
        //dispose the original CalendarExtender, change “CalendarExtender2″ to the BehaviorID of your CalendarExtender
        $find(“CalendarExtender2″).dispose();

        //Step2:
        //change the “Sys.CultureInfo.CurrentCulture.dateTimeFormat, as your wish”
        Sys.CultureInfo.CurrentCulture.dateTimeFormat.FirstDayOfWeek = 3;
        Sys.CultureInfo.CurrentCulture.dateTimeFormat.ShortestDayNames = ["0", "1", "2", "3", "4", "5", "6"];

        //Step3:
        //Recreate the CalendarExtender
        $create(AjaxControlToolkit.CalendarBehavior, { “button”: $get(“image2″), “id”: “CalendarExtender2″, “popupPosition”: 1 }, null, null, $get(“TextBox1″));
    }     
         
</script>

 Also, we need make sure the EnableScriptGlobalization=”true” to your ToolkitScriptManager or ScriptManager.

For more information about “Sys.CultureInfo.CurrentCulture.dateTimeFormat”, please visit:
http://msdn.microsoft.com/en-us/library/bb397445.aspx

For more information about create Extenders by $create, please visit:

ASP.NET AJAX Control Toolkit FAQ: 6.2 How do I create a ModalPopup programmatically?
http://forums.asp.net/t/992919.aspx

The full page demo is following:

<%@ Page Language=”C#” %>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<script runat=“server”>

    protected void Page_Load(object sender, EventArgs e)
    {
        string Lang = “ro-RO”;//set your culture here
        System.Threading.Thread.CurrentThread.CurrentCulture =
            new System.Globalization.CultureInfo(Lang);
    }
</script>

<html xmlns=“http://www.w3.org/1999/xhtml”>
<head id=“Head1″ runat=“server”>
    <title></title>
</head>
<body>
    <form id=“form1″ runat=“server”>
    <ajaxToolkit:ToolkitScriptManager ID=“ToolkitScriptManager1″ runat=“server” EnableScriptGlobalization=“true”>
    </ajaxToolkit:ToolkitScriptManager>
    <div>
        <asp:TextBox ID=“TextBox1″ runat=“server”></asp:TextBox>
        <ajaxToolkit:CalendarExtender ID=“CalendarExtender2″ runat=“server” TargetControlID=“TextBox1″
            FirstDayOfWeek=“default” PopupButtonID=“image2″ Enabled=“True” PopupPosition=“BottomRight”
            BehaviorID=“CalendarExtender2″>
        </ajaxToolkit:CalendarExtender>
    </div>

    <script type=“text/javascript”>

        function pageLoad(sender, args) {

            //Step1:
            //dispose the original CalendarExtender, change “CalendarExtender2″ to the BehaviorID of your CalendarExtender
            $find(“CalendarExtender2″).dispose();

            //Step2:
            //change the “Sys.CultureInfo.CurrentCulture.dateTimeFormat, as your wish”
            Sys.CultureInfo.CurrentCulture.dateTimeFormat.FirstDayOfWeek = 3;
            Sys.CultureInfo.CurrentCulture.dateTimeFormat.ShortestDayNames = ["0", "1", "2", "3", "4", "5", "6"];

            //Step3:
            //Recreate the CalendarExtender
            $create(AjaxControlToolkit.CalendarBehavior, { “button”: $get(“image2″), “id”: “CalendarExtender2″, “popupPosition”: 1 }, null, null, $get(“TextBox1″));
        }     
             
    </script>

    </form>
</body>
</html>

Thanks.

Possibly related posts: (automatically generated)

January 9, 2009 - Posted by Lance Zhang | ASP.NET AJAX, ASP.NET AJAX Advance Tips & Tricks, Code and Solution | , | 4 Comments

4 Comments »

  1. salam

    thanks my friend for this tip&trick! thanks very much. If i not found your article I tried to change all of the CalendarExtender codes!

    Comment by Ali | April 30, 2009 | Reply

  2. Excellent. Many thanks for the very useful information..!!

    Comment by Srinivas | May 14, 2009 | Reply

  3. Hi I tried the second approach, it is giving the parent null exception. do i need to pass the parent container id to the find method?

    Comment by Srinivas | May 14, 2009 | Reply

  4. Other example, how to change the culture in client side
    calendar extender

    http://www.forosdelweb.com/f78/asp-net-calendar-extender-change-language-globalization-cambiar-idioma-ajax-postback-706809/

    Comment by jorge | June 6, 2009 | Reply


Leave a comment

« Previous | Next »