LanceZhang's Blog

2 ways to retireve the uniqueidentification field after insert

Lance Zhang — Fri, 01 Apr 2011 06:54:41 +0000

Using uniqueidentifier field as primary key and set the default value as (newsequentialid()) or (newid()) is a good choose for some scenerio.

If you try to use SCOPE_IDENTITY() or @@IDENTITY to retireve the uniqueidentification ID after add new row, you will found that is not worked.

There are two solution to achieve the facing goal:

DECLARE @outputTable TABLE(ID uniqueidentifier)
INSERT INTO TABLE1(col1, col2)
OUTPUT INSERTED.ID INTO @outputTable
VALUES(‘value1′, ’value2′)
SELECT ID FROM @outputTable

– mark your ID field as ROWGUID
INSERT INTO TABLE1(col1, col2)
VALUES(‘value1′, ’value2′)
SELECT ROWGUIDCOL FROM TABLE1

A common Log class for .NET

Lance Zhang — Wed, 08 Apr 2009 02:37:51 +0000

LanceZhang.Common.Log

Methods:

1. Output(string)

This method is used for record the normal Logs, it will create a file name like “log_20090408.txt” to the root directory of your application, and append the log message:

2.OutputError(string)

Just like the Output method, this method not only output the log message, but also output the following messages:

File name
Method name
Line number
Column number

which is useful for an exception analysis

Example:

    try
    {
        int i = 8;
        int j = 0;
        int c = i / j;
    }
    catch (Exception ex)
    {
        Log.OutputError(ex.Message);
    }

Then, the output is like:

Code：

/****************************** Module Header ******************************
* Module Name:    Log.cs
* Project:    LanceZhang.Common
* Copyright (c) Lance Zhang (blodfox777@hotmail.com)
*
* History:
* * 3/7/2009 2:50 Lance Zhang Created
***************************************************************************/

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
using System.Diagnostics;

namespace LanceZhang.Common
{
    public static class Log
    {
        private static object lockobj=new object();

        private static void WriteToFile(string filename, string content)
        {
            using (StreamWriter sw = new StreamWriter(filename, true))
            {
                sw.WriteLine(content);
                sw.Close();
            }
        }

        private static string GetDateTime()
        {
            return “[" + DateTime.Now.ToString("HH:mm:ss") + "] “;
        }

        public static void Output(string msg)
        {
            lock (lockobj)
            {
                Log.WriteToFile(Directory.GetCurrentDirectory()+ @”\log_“ + DateTime.Now.ToString(“yyyyMMdd“) + “.txt“, GetDateTime() + msg);
            }
        }

        public static void OutputError(string msg)
        {
            lock (lockobj)
            {
                StackFrame sf = new StackTrace(true).GetFrame(1);
                StringBuilder sb = new StringBuilder(GetDateTime());
                sb.Append(“ERROR:“);
                sb.AppendLine(msg);
                sb.AppendLine(“Error from:“);
                sb.AppendLine(sf.GetFileName());
                sb.Append(“Line:“);
                sb.AppendLine(sf.GetFileLineNumber().ToString());
                sb.Append(“Column:“);
                sb.AppendLine(sf.GetFileColumnNumber().ToString());
                sb.Append(“Method:“);
                sb.Append(sf.GetMethod().Name);
                Log.WriteToFile(Directory.GetCurrentDirectory() + @”\log_“ + DateTime.Now.ToString(“yyyyMMdd“) + “.txt“,  sb.ToString());
            }
        }
    }
}

Preview and check Image info before upload

Lance Zhang — Mon, 16 Feb 2009 01:54:48 +0000

That will only work in IE:

DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
    <title>validate before upload by Lance Zhangtitle>
head>
<body style=”font-family:Calibri”>
    <form name=”Myform”>
    <p>
        <font color=”red” size=”6″>File type :gif,jpg,jpeg,png,bmpfont>p>
    <p>
        File Size limit:
        <input type=”text” size=”4″ value=”100″ name=”fileSizeLimit” id=”fileSizeLimit” />
        Kp>
    <p>
        Image Height Limit: <input type=”text” size=”4″ value=”100″ name=”heightLimit” id=”heightLimit” />
    p>
    <p>
        Image Width Limit: <input type=”text” size=”4″ value=”100″ name=”widthLimit” id=”widthLimit” />
    p>
    <p>
        <input type=”file” name=”photo” onchange=”changeSrc(this)” />
        Image Preview<img src=”about:blank” id=”fileChecker” name=”fileChecker” alt=”test” />
    p>
    <p>
        <input type=”submit” value=”submit”>
    p>
    form>

var oFileChecker = document.getElementById(“fileChecker“);

     function changeSrc(filePicker)
     {
        if(!checkImgType(filePicker.value))
        {
            alert(“the file type is not correct“);
            return;
        }
        oFileChecker.src = filePicker.value;
     }

    oFileChecker.onreadystatechange = function ()
    {
        if (oFileChecker.readyState == “complete“)
        {
            CheckFileSize();
        }
    }

script>

body>
html>

TinyMCE Editor and Ajax Control Toolkit Tab Control

Lance Zhang — Tue, 20 Jan 2009 06:30:15 +0000

As we know, the ASP.NET forum’s add post page contains a TabContainer control in one TabPanel there is a TinyMCE Editor for edit the post, another TabPanel is use for preview the post.

In this case, I have created a demo like that:

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

xmlns=“http://www.w3.org/1999/xhtml”>
id=“Head1″ runat=“server”>

    id=“form1″ runat=“server”>

        ID=“ScriptManager1″ runat=“server”>

        ID=“TabContainer1″ runat=“server” ActiveTabIndex=“0″ Height=“300px”
            Width=“100%” OnClientActiveTabChanged=“preview”>
            runat=“server” HeaderText=“Edit Post” ID=“TabPanel1″>


                    id=“elm1″ name=“elm1″ rows=“15″ cols=“80″ style=“width: 99%; height: 280px;”>

src=“media/logo.jpg” alt=” “ hspace=“5″ vspace=“5″ width=“250″ height=“48″ align=“right” /> TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control released as Open Source under LGPL by Moxiecode Systems AB. It has the ability to convert HTML TEXTAREA fields or other HTML elements to editor instances. TinyMCE is very easy to integrate into other Content Management Systems.

We recommend href=“http://www.getfirefox.com” target=“_blank”>Firefox and href=“http://www.google.com” target=“_blank”>Google />

            runat=“server” HeaderText=“Preview” ID=“TabPanel2″>

                    ID=“Label1″ runat=“server” Text=“Label”>


            runat=“server” HeaderText=“TabPanel3″ ID=“TabPanel3″>

                    Other



        ID=“Button1″ runat=“server” Text=“Button” OnClientClick=“document.write(tinyMCE.get(‘elm1′).getContent());return false;” />

Create Tooltip dynamically by AJAX and WebService

Lance Zhang — Mon, 12 Jan 2009 07:18:29 +0000

Use Pop up div by JavaScript or AJAX Control Toolkit’s Hover Menu control can create a Tooltip easily.

However, if we need to create the content of tooltip dynamically by the Server-Side code, we can use the ICallbackEventHandler to achieve the faing goal, just like the solution in following link:

http://lancezhang.wordpress.com/2008/12/04/create-tooltip-dynamically/

When you move the mouse on the text, the related image and text which will be created on the code-behind show up in the tooltip after 1 second. during the loading process, a “loading” gif picture will display in the tooltip box.

If we are using ASP.NET AJAX, the same effect can be achieve by AJAX Page Method easily, just like the solution in following link:

http://lancezhang.wordpress.com/2009/01/12/create-tooltip-dynamically-by-ajax-pagemethod/

And we can also use WebService and AJAX to achieve the same goal.

Ok, here we go:

Step 1:

First, let’s add the WebService reference to our page:

 ID=“ScriptManager1″ runat=“server”>

         Path=“~/tooltiptest3.asmx” />

Step 2:

Let’s create the WebService for create tooltip message:

C#: tooltiptest3.asmx

<%@ WebService Language=“C#” Class=“tooltiptest3″ %>
using System;

using System.Web;

using System.Web.Services;

using System.Web.Services.Protocols;
[WebService(Namespace = "http://tempuri.org/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 

[System.Web.Script.Services.ScriptService]

public class tooltiptest3  : System.Web.Services.WebService {
    [WebMethod]

    public string GetTooltip(string imagename)

    {

        System.Threading.Thread.Sleep(1000);

        return @”this is just a demo: 
 + imagename + “‘/>”;

    }

}

Step 3:

Complete the JavaScript code to invoke the page method:

OK, the full page code is following:

<%@ Page Language=”C#” %>
 xmlns=“http://www.w3.org/1999/xhtml”>

 id=“Head1″ runat=“server”>
    
    </span>Untitled Page<span style="font-weight:bold;color:#000080;">

 style=“font-family: Calibri; font-size: 15px;”>

     id=“form1″ runat=“server”>

     ID=“ScriptManager1″ runat=“server”>

             Path=“~/tooltiptest3.asmx” />

     id=“tooltipDiv” class=“style1″>

         src=“loading.gif” />

        ID=“Label1″ runat=“server” Text=“http://forums.asp.net/Themes/FAN/style/i/logo.png”
            onmouseout=“HandleMouseOut()” onmouseover=“HandleMouseOver(this)”>
        />
        />
        />
        />
        ID=“Label2″ runat=“server” Text=“http://forums.asp.net/Themes/fan/images/roleicons/a874d69e-0ac8-4b80-acc7-512767e281f6.gif”
            onmouseout=“HandleMouseOut()” onmouseover=“HandleMouseOver(this)”>

Create Tooltip dynamically by AJAX PageMethod

Lance Zhang — Mon, 12 Jan 2009 07:15:55 +0000

Use Pop up div by JavaScript or AJAX Control Toolkit’s Hover Menu control can create a Tooltip easily.

However, if we need to create the content of tooltip dynamically by the Server-Side code, we can use the ICallbackEventHandler to achieve the faing goal, just like the solution in following link:

http://lancezhang.wordpress.com/2008/12/04/create-tooltip-dynamically

If we are using ASP.NET AJAX, the same effect can be achieve by AJAX Page Method easily.

Ok, here we go:

Step 1:

we need to set the EnablePageMethods=”true” for our ScriptManager or ToolkitScriptManager:

 ID=“ScriptManager1″ runat=“server” EnablePageMethods=“true”>

Step 2:

Let’s create the Server-side method for create tooltip message, please notice the using references and attribute:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Services;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;
[ScriptService]

public partial class tooltiptest2 : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {
    }
    [WebMethod]

    public static string GetTooltip(string imagename)

    {

        System.Threading.Thread.Sleep(1000);

        return @”this is just a demo: 
 + imagename + “‘/>”;

    }

}

Step 3:

Complete the JavaScript code to invoke the page method:

OK, the full code is following:
<%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”tooltiptest2.aspx.cs” Inherits=”tooltiptest2″ %>

 xmlns=“http://www.w3.org/1999/xhtml”>

 id=“Head1″ runat=“server”>
    
    </span>Untitled Page<span style="font-weight:bold;color:#000080;">

 style=“font-family: Calibri; font-size: 15px;”>

     id=“form1″ runat=“server”>

     ID=“ScriptManager1″ runat=“server” EnablePageMethods=“true”>

     id=“tooltipDiv” class=“style1″>

         src=“loading.gif” />

         ID=“Label1″ runat=“server” Text=“http://forums.asp.net/Themes/FAN/style/i/logo.png”

            onmouseout=“HandleMouseOut()” onmouseover=“HandleMouseOver(this)”>

         />

         />

         />

         />

         ID=“Label2″ runat=“server” Text=“http://forums.asp.net/Themes/fan/images/roleicons/a874d69e-0ac8-4b80-acc7-512767e281f6.gif”

            onmouseout=“HandleMouseOut()” onmouseover=“HandleMouseOver(this)”>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Script.Services;

using System.Web.Services;

using System.Web.UI;

using System.Web.UI.WebControls;

[ScriptService]
public partial class tooltiptest2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}

    [WebMethod]
    public static string GetTooltip(string imagename)
    {
        System.Threading.Thread.Sleep(1000);
        return @”this is just a demo:
+ imagename + “‘/>”;
    }
}

How to change the Culture of CalendarExtender programmatically

Lance Zhang — Fri, 09 Jan 2009 09:16:36 +0000

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.

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#” %>
 xmlns=“http://www.w3.org/1999/xhtml”>

 id=“Head1″ runat=“server”>

     id=“form1″ runat=“server”>

     ID=“ToolkitScriptManager1″ runat=“server” EnableScriptGlobalization=“true”>

         ID=“TextBox1″ runat=“server”>

         ID=“CalendarExtender2″ runat=“server” TargetControlID=“TextBox1″

            FirstDayOfWeek=“default” PopupButtonID=“image2″ Enabled=“True” PopupPosition=“BottomRight”

            BehaviorID=“CalendarExtender2″>

Thanks.

Create Tooltip dynamically by ASP.NET Callback

Lance Zhang — Thu, 04 Dec 2008 07:27:02 +0000

Use Pop up div by JavaScript or AJAX Control Toolkit’s Hover Menu control can create a Tooltip easily.

However, if we need to create the content of tooltip dynamically by the Server-Side code, we can use the ICallbackEventHandler to achieve the faing goal.

Please try the following demo, when you move the mouse on the text, the related image and text which will be created on the code-behind show up in the tooltip after 1 second. during the loading process, a “loading” gif picture will display in the tooltip box.

Ok, here we go:

<%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”tooltiptest.aspx.cs” Inherits=”tooltiptest” %>

xmlns=“http://www.w3.org/1999/xhtml”>
id=“Head1″ runat=“server”>

    </span>Untitled Page<span style="font-weight:bold;color:#000080;">

style=“font-family: Calibri; font-size: 15px;”>
    id=“form1″ runat=“server”>
    id=“tooltipDiv” class=“style1″>
    src=“loading.gif”/>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class tooltiptest : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler
{
string tooltip;

    public void RaiseCallbackEvent(String eventArgument)
    {
        string filename = eventArgument;
        tooltip = GetTooltip(filename);
    }

    public string GetCallbackResult()
    {
        return tooltip;
    }

    protected string GetTooltip(string imagename)
    {
        System.Threading.Thread.Sleep(1000);
        return @”this is just a demo:
+ imagename+“‘/>”;
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        String cbReference = Page.ClientScript.GetCallbackEventReference(this, “arg”, “ReceiveServerData”, “context”);
        String callbackScript = “function CallTheServer(arg, context) {“ + cbReference + “; }”;
        Page.ClientScript.RegisterClientScriptBlock(this.GetType(), “CallTheServer”, callbackScript, true);
    }
}

ASP.NET AJAX Performance Improvement

Lance Zhang — Sat, 15 Nov 2008 12:12:37 +0000

Preface

I think everyone would agree that AJAX is one of the elements of “Web 2.0″, every web developers should know this technology. I have been collected a list of the popular AJAX Frameworks on my chinese tech blog, we will amazedly found that, there are more than 128 AJAX Frameworks!

Refer to a voting result, among the 95% of the .NET developers that said they are using some flavor of Ajax either in production, development or prototype, the most used AJAX Framework is ASP.NET AJAX, with 73,7%, followed by the Ajax Control Toolkit which is used by almost half of the .NET developer that are using Ajax.

However, many beginners always complain that, using ASP.NET AJAX make their web application slow down, don’t perform as well as they had hoped. Today, I would like to share some experience on how to optimize the ASP.NET AJAX application.

So I created a simple page with a bunch of extenders on it: CalendarExtender, SliderExtender, NumericUpDownExtender, RoundedCornersExtender, and TabContainer for our experiments.

And I would like to introduce two useful tools for our Performance Analysis:

1. HttpWatch to show the network traffic.

Here’s how the network traffic looked before any optimization:

And we can see there are totally 22 requests and spend 9 seconds to get the 654k result. It is a really terrible in performance.

2. ScriptReferenceProfiler to show the JavaScript reference.

ScriptReferenceProfiler is an open source tool on CodePlex, for analysis the JavaScript references of ASP.NET AJAX, we can simply add the following code to our page in order to show the JavaScript references imported by ScriptManager.

 runat=“server”>

We can see, before any optimization, there are 17 references found on this page, include the Microsoft Ajax Core runtime, asynchronous postback scripts, Ajax Control Toolkit Extender scripts and so on:

Optimization in web.config

To optimize the ASP.NET AJAX in our web application, first of all, we need to make sure the Compression and Caching is enabled in our web.config:

.web.extensions>
ing>
ResourceHandler enableCompression=“true” enableCaching=“true”/>

</system.web.extensions>

1. Enable The Caching:

We know, in the development of web application, enable the caching is a must operation. To enable the caching of ASP.NET AJAX, we need make sure the enableCaching property of scriptResourceHandler is set to true.

As our expected, the page response more quickly in the second time, the expend time is coming from 12.862 seconds down to 0.409seconds; and the received size from server decrease from 692K to 14K.

2. Enable The Compression:

The Caching will saving almost 95% of the network traffic in the second time we request the page, however, the first page request still ask for a huge data from server. How to reduce the first request? don’t worry, set enableCompression property of scriptResourceHandler to true will help:

As we can see in the screen shot, many script files are getting smaller. and the total size decrease form 692K to 183K, about 1/4 compare to before.

♣Note: The compression is not work in Internet Explorer 6.0, because there is an known bug in IE 6, that cause the mistake might be occur when receiving the Gzip header. So the develop team close all the compression ability in IE 6.

Optimization in ScriptManager

The ScriptManager control manages client script for AJAX-enabled ASP.NET Web pages. By default, the ScriptManager control registers the script for the Microsoft AJAX Library with the page. This enables client script to use the type system extensions and to support features such as partial-page rendering and Web-service calls. Following, we need to setting the property of ScriptManager to optimize the performance of ASP.NET AJAX.

1. ScriptMode for Release

In one of Scott Guthrie’s post , he explain that we should avoid when deploying an ASP.NET application into production leave the switch on within the application’s web.config file.

It will cause:

1) The compilation of ASP.NET pages takes longer (since some batch optimizations are disabled)

2) Code can execute slower (since some additional debug paths are enabled)

3) Much more memory is used within the application at runtime

4) Scripts and images downloaded from the WebResources.axd handler are not cached

In this scenario, we can set the ScriptManager on the page run into the release mode to like the following:

<asp:ScriptManager ID=”ScriptManager1″ runat=”server” ScriptMode=”Release”>

asp:ScriptManager>

2. EnablePartialRendering Yes or No?

There is another property in ScriptManager named EnablePartialRendering, it gets or sets a value that enables partial rendering of a page, which in turn enables you to update regions of the page individually by using UpdatePanel controls.

So, if we using the UpdatePanel in the page, we must set this property to true, conversely, if the UpdatePanel is not using in our page, it would be better that we set the EnablePartialRendering to false.

That will cause the unnecessary file “MicrosoftAjaxWebForm.js”, which is used to the partial rendering not import to our page.

<asp:ScriptManager ID=”ScriptManager1″ runat=”server” EnablePartialRendering=”false”>

asp:ScriptManager>

3. LoadScriptBeforeUI

ScriptManager control has LoadScriptsBeforeUI property which we can set to “False” in order to postpone several script downloads after the content is downloaded and shown. This adds the script references end of the tag. As a result, we will see the content first and then the additional scripts, exteders, AJAX Control Toolkit scripts get downloaded and initialized.

This will make the page show quikly, and provide a better User Experience.

Script Combining

In the previous talk, we can see the download size is coming down, but the number of requests is still more than 20

1. ToolkitScriptManager

There is a ToolkitScriptManager control in the AJAX Control Toolkit, we can replace the default control with this, it supports the ability to dynamically merge multiple client-side Javascript scripts into a single file that is downloaded to the client at runtime. Better yet, only the Javascript needed by the specific controls on the page are included within the combined download, to make it as small as possible.

As the screen shot shows, It is a big savings in requests - we now get one request for Toolkit scripts instead of 12. In this scenario, we also got about a 50% download speed improvement by only having one request.

2. CompositeScript

If you are using ASP.NET 3.5 with SP1, there is a more powerful tool to combining the Script file – CompositeScript.

First, We can use the ScriptReferenceProfiler to show the JavaScript references

and then, we can add and elements as children of the ScriptManager control.

Then, Copy the script references from the page and paste them into the element inside the ScriptManager control, the result mark up is following:

<asp:ScriptManager ID=”ScriptManager1″ runat=”server” EnablePartialRendering=”false” ScriptMode=”Release” LoadScriptsBeforeUI=”false”>

<asp:ScriptReference Name=”MicrosoftAjax.js” />

<asp:ScriptReference Name=”AjaxControlToolkit.Common.Common.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.ExtenderBase.BaseScripts.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Tabs.Tabs.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.DynamicPopulate.DynamicPopulateBehavior.js”

Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Common.DateTime.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Compat.Timer.Timer.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Animation.Animations.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Animation.AnimationBehavior.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.PopupExtender.PopupBehavior.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Common.Threading.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Calendar.CalendarBehavior.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Compat.DragDrop.DragDropScripts.js”

Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

<asp:ScriptReference Name=”AjaxControlToolkit.Slider.SliderBehavior.js” Assembly=”AjaxControlToolkit, Version=3.0.20229.23352, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e” />

Scripts>

CompositeScript>

asp:ScriptManager>

Run the page and view the traffic. We will see just one script reference now instead of all the script inside the element.

ASP.NET AJAX Advance Tips & Tricks (2) Create Rating Control dynamically

Lance Zhang — Mon, 10 Nov 2008 03:42:30 +0000

Preface:

Rating control of AJAX Control Toolkit are already widely used, However, many of my friends recently complained that if they create Rating control in code-behind dynamically, then, the Rating status will be lost after a PostBack(not into ViewState). This article describes two ways to solve the problem.

To reproduce the problem:

If we use the following code to create Rating control dynamically, then after the Button click, Rating selected value will be lost:

<%@ Page Language=”C#” %>
<%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”cc1″ %>

 xmlns=“http://www.w3.org/1999/xhtml”>

 runat=“server”>

     id=“form1″ runat=“server”>

     ID=“ToolkitScriptManager1″ runat=“server”>

 ID=“Button1″ runat=“server” Text=“Button” />

Reason

The problem is because we cannot create the Rating control in the Page_Load, just as we create other server-side controls (for example, TextBox, and so on) in code-behind. the Rating control must be created in Page_Init if we need ViewState to save its status across the PostBack.

Solution 1:

We can create the Rating control in Page_Init:

<%@ Page Language=”C#” %><%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”cc1″ %>

 xmlns=“http://www.w3.org/1999/xhtml”>

 runat=“server”>

     id=“form1″ runat=“server”>

     ID=“ToolkitScriptManager1″ runat=“server”>

     ID=“Button1″ runat=“server” Text=“Button” />

Solution 2:

we can use Hidden Field to save the state of Rating control:

Note: We need to set up the Rating control’s BehaviorID, in order to call the Rating’s js interface in JavaScript

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

<%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”cc1″ %>

 xmlns=“http://www.w3.org/1999/xhtml”>

 runat=“server”>

     id=“form1″ runat=“server”>

     ID=“ToolkitScriptManager1″ runat=“server”>

     ID=“Panel1″ runat=“server” onclick=“save_rate();”>

     ID=“Button1″ runat=“server” Text=“Button” />

     id=“Hidden1″ runat=“server” type=“hidden” value=“1″ />