Thứ Hai, 18 tháng 3, 2013

What is the difference between GetPostBackEventReference and GetPostBackClientHyperlink?

GetPostBackEventReference is used to raise postback from a control which has OnClick event associated with it. Meanwhile, GetPostBackClientHyperlink is used to raise post back from a  control without OnClick event associated with it, such as HyperLink...

The following code example demonstrates the difference between GetPostBackEventReference and  GetPostBackClientHyperlink method.

<%@ 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">

  public class MyControl : Label, IPostBackEventHandler
  {

    // Use the constructor to defined default label text.
    public MyControl()
    {
      base.Text = "No postback raised.";
    }

    // Implement the RaisePostBackEvent method from the
    // IPostBackEventHandler interface. 
    public void RaisePostBackEvent(string eventArgument)
    {
      base.Text = "Postback handled by " + this.ID.ToString() + ". <br/>" +
                  "Postback caused by " + eventArgument.ToString() + ".";

    }
  }

  protected void Page_Load(object sender, EventArgs e)
  {
    // Get a ClientScriptManager reference from the Page class.
    ClientScriptManager cs = Page.ClientScript;

    // Create an instance of the custom label control and 
    // add it to the page.
    MyControl mycontrol = new MyControl();
    mycontrol.ID = "mycontrol1";
    PlaceHolder1.Controls.Add(mycontrol);
    PlaceHolder1.Controls.Add(new LiteralControl("<br/>"));

    // Create a button element with its onClick attribute defined
    // to create a postback event reference to the custom label control.
    HtmlInputButton b = new HtmlInputButton();
    b.ID = "mybutton1";
    b.Value = "Click";
    b.Attributes.Add("onclick", cs.GetPostBackEventReference(mycontrol, b.ID.ToString()));
    PlaceHolder1.Controls.Add(b);
    PlaceHolder1.Controls.Add(new LiteralControl("<br/>"));

    // Create a link element with its href attribute defined
    // to create a postback event reference to the custom label control.
    HtmlAnchor a = new HtmlAnchor();
    a.ID = "myanchor1";
    a.InnerText = "link";
    a.HRef = cs.GetPostBackClientHyperlink(mycontrol, a.ID.ToString());
    PlaceHolder1.Controls.Add(a);
  }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>ClientScriptManager Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
      <asp:PlaceHolder id="PlaceHolder1" 
                       runat="server">
      </asp:PlaceHolder>
    </div>
    </form>
</body>
</html>

Thứ Hai, 11 tháng 3, 2013

Resolve problem of SimpleModal not being displayed when adding ScriptManager on the page

I came across the plug-in called "SimpleModal" that was developed by plasm in Mootools. You can read more and run the demo on http://simplemodal.plasm.it



This modal works great. However, SimpleModal doesn't work if there is ScriptManager on the page. I'm disappointed a bit because most of ASP.NET pages need ScriptManager to handle the Postback. After searching around for solutions but getting no luck. There seems to be no answers on Internet. I decided to investigate what the cause might be. Accidentally, I found a workaround. It's quite simple. I tried to do something with ScriptManager by going through all of its attributes. And here is the idea:

Workaround: Assign a value to ScriptPath. It could be any value, as long as it's not empty. See the highlighted section below:
<asp:ScriptManager ID="ScriptManager1" runat="server" ScriptPath="MyCustomScriptPath">
</asp:ScriptManager>

Now please compare the source view before and after adding ScriptPath. Use the online tool (http://www.diffnow.com/) to see the difference.

In below screen (click to room in), the left half represents the source that causes SimpleModal problem and the right half represents the changes (ScriptPath):


Now. It works pretty good. At least, I can use SimpleModal for many ASP.NET pages in my projects. For complicated pages, I'm not sure if there are any other conflicts :-) Then, I'll go about resolving it once I encounter these.

You can download the modified demo code at: SimpleModal

That's it. I'm so relieved!
Please share with me on my blogs if you have any finding with this plug-in.