views:

2036

answers:

2

Hi guys... My code :

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

<script runat="server">

    void button_Click(object sender, EventArgs e)
    {
        label.Text = "Refreshed by server side event handler at " + DateTime.Now + ".<br>Value provided:" + text.Text;
    }

</script>      
<html>
<head>
    <title>How to update an UpdatePanel with JavaScript</title>

    <script type="text/javascript">
        function UpdPanelUpdate(id) {
            var obj = document.getElementById("<%= text.ClientID %>");
            obj.value = id;
            __doPostBack("<%= button.ClientID %>", "");
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <div>
        <a href="javascript:UpdPanelUpdate('Value passed by javascript')">Update the Panel</a>
        <asp:TextBox ID="text" runat="server" Style="display: none;"></asp:TextBox>
        <asp:Button ID="button" runat="server" OnClick="button_Click" Style="display: none;" />
        <asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="false">
            <contenttemplate>
               <asp:Label ID="label" runat="server"></asp:Label>
            </contenttemplate>
            <triggers>
               <asp:AsyncPostBackTrigger ControlID="button" EventName="Click" />
            </triggers>
        </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

That works great, but when I use it with a Masterpage, the link does´t seems to work... No error, but nothing happens...

Any idea?

Thanks!

+1  A: 

Have you ensured the ScriptManager is included correctly on the master page? You might find this link useful; Using the ASP.NET UpdatePanel Control with Master Pages

Dave Anderson
+1  A: 

In your JavaScript try using UniqueID instead of ClientID:

function UpdPanelUpdate(id) {
            var obj = document.getElementById("<%= text.UniqueID%>");
            obj.value = id;
            __doPostBack("<%= button.UniqueID%>", "");
        }

Let me know if that works.

I suspect what's happening is the textbox ID is no longer what you expect it to be. The ID is originally "text" however once you move that page to a Master Page things change. Since controls are now contained in the master page their IDs effectively change to show this relationship. So instead of the textbox's ID being "text" it is now going to be something like ctl00$cphBody$text - where "ctl100" is the Master Page's ID prefix and "cphBody" is the value you assigned to that page's ContentPlaceHolderID, respectively.

Sure, from the code behind you can do this.text.Text = "new value" and directly access it. That's fine. But try using FindControl and you'll notice things get confusing. The easiest way to really understand what I am describing is to do the following on your page with it using the master page:

  1. Set a breakpoint on page load
  2. Bring up your Immediate Window (CTRL + ALT + I)
  3. Type this in: ?this.text.ID (you should see text)
  4. Type in: ?this.text.ClientID (you should see ctl00_cphBody_text)
  5. Type in: ?this.text.UniqueID (you should see ctl00$cphBody$text)
  6. Now test the results you got for steps 3-5 using FindControl. Use ?this.FindControl("text") and ?this.FindControl("ctl00_cphBody_text") and ?this.FindControl("ctl00$cphBody$text") - all but the last one should return null.

To further understand this I suggest reading this article, specifically the section titled "FindControl, JavaScript, and Naming Containers."

EDIT: I'm actually unable to test the function at the moment, but I'm wondering if what I posted about FindControl applies to JavaScript accessing the control. Based on this article it seems ClientID is suggested over UniqueID. So this may not work.

Ahmad Mageed
Thanks... But the ID is right on the masterpage...The obj is ok as well...
Paul