Tuesday, August 17, 2010

How to force the IE8 emulate IE7 feature

Just add this line to the head block of the page.



<head>
<!-- Mimic Internet Explorer 7 -->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >
<title>My Web Page</title>
</head>

More details:
http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx

Monday, August 16, 2010

Important notes when we create web service methods for some extenders in AjaxControlToolkit package

AjaxControlToolkit is a useful package for us to work with ASP.NET AJAX. There some extenders and controls need webservice to return the data. For example, AutoCompleteExtender, CascadingDropDown, NumericUpDownExtender and so on.
Here we talked about the AutoCompleteExtender as an example.
There are two ways to create a webservice method for the extender, in an isolated web service page(*.asmx), in the code-behind of the page which use the extender.

A) Create an isolated web service page
Here is a full web service page for an AutoCompleteExtender.

Some tips we need to pay attention:

  • First, we need [System.Web.Script.Services.ScriptService] for the service class.
  • Second, we need [WebMethod] for the method.
  • Third, all the parameters names could not be changed.
  • Forth, in a web service page, we Don't Need the "static" qualifier.


[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class AutoComplete : WebService
{
public AutoComplete()
{
}

[WebMethod]
public string[] GetCompletionList(string prefixText, int count)
{
if (count == 0)
{
count = 10;
}

if (prefixText.Equals("xyz"))
{
return new string[0];
}

Random random = new Random();
List<string> items = new List<string>(count);
for (int i = 0; i < count; i++)
{
char c1 = (char) random.Next(65, 90);
char c2 = (char) random.Next(97, 122);
char c3 = (char) random.Next(97, 122);

items.Add(prefixText + c1 + c2 + c3);
}

return items.ToArray();
}
}

B) Service method in the page code behind

Here is a code snippet for the service method in the page.
Some tips need to pay attention here.
  • First, we need [System.Web.Services.WebMethod] for the service method.
  • Second, we need [System.Web.Script.Services.ScriptMethod] for the service method.
  • Third, all the parameters names could not be changed.
  • Forth, in an inline web service method, we NEED the "static" qualifier.


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

}

[System.Web.Services.WebMethod]
[System.Web.Script.Services.ScriptMethod]
public static string[] GetCompletionList(string prefixText, int count)
{
if (count == 0)
{
count = 10;
}

if (prefixText.Equals("xyz"))
{
return new string[0];
}

Random random = new Random();
List<string> items = new List<string>(count);
for (int i = 0; i < count; i++)
{
char c1 = (char) random.Next(65, 90);
char c2 = (char) random.Next(97, 122);
char c3 = (char) random.Next(97, 122);

items.Add(prefixText + c1 + c2 + c3);
}

return items.ToArray();
}
}

Sunday, August 15, 2010

How to register javascript functions after UpdatePanel updated

As an ASP.NET fellow, UpdatePanel just like one artifacts. It can make all the contents in one UpdatePanel get an partial-refresh(AJAX) feature.
Usually, we need to call a javascript function after we update the content in the UpdatePanel. Without UpdatePanel, we could add onclick attribute to one button or use Page.ClientScript to register the script in code-behind. But in the UpdatePanel, Page.ClientScript will lose efficacy.
In this document, I want to discuss some methods to register javascript functions after the UpdatePanel updated.
ASP.NET Extension provide us some useful and direct ways to call a javascript function both in client-side and server-side.
Client-side:
Method A:
Look at this code snippet:

01 <form id="form1" runat="server">
02 <asp:ScriptManager ID="ScriptManager1" runat="server">
03 </asp:ScriptManager>
04
05 <script type="text/javascript">
06 function pageLoad(sender, e) {
07 alert("Page is re-loaded!");
08 }
09 </script>
10
11 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
12 <ContentTemplate>
13 <%=DateTime.Now.ToString() %>
14 </ContentTemplate>
15 <Triggers>
16 <asp:AsyncPostBackTrigger ControlID="TriggerTimer" EventName="Tick" />
17 </Triggers>
18 </asp:UpdatePanel>
19
20 <asp:Timer ID="TriggerTimer" runat="server" Interval="5000">
21 </asp:Timer>
22 </form>


In this snippet, we could see we register the pageLoad function directly in the page. the function pageLoad will be executed when the page first load and each asynchronous postback which caused by UpdatePanel.

Method B:

The code above in pageLoad is same as the code below.


1 <script type="text/javascript">
2 window.onload = function () {
3 Sys.Application.add_load(function () {
4 alert("Page re-loaded!");
5 });
6 }
7 </script>

Server Side:

For server side, we need to use a method, ScriptManager.RegisterClientScriptBlock, for more details about this method, please view this link in MSDN:http://msdn.microsoft.com/en-us/library/system.web.ui.scriptmanager.registerclientscriptblock.aspx. This method registers a client script block with the ScriptManager control for use with a control that is inside an UpdatePanel control, and then adds the script block to the page.

For example,


1 protected void TriggerTimer_Tick(object sender, EventArgs e)
2 {
3 ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "RegScript",
4 "alert('Page re-loaded!');", true);
5 }
The result is same as the methods which talked above.