Postback problem when PopupExtender is placed inside a user control

I am creating a ModalPopupExtender inside a Web User Control. When i click on the OK Button in the panel, which is showing as model popup, the Event Handeler of the button is not executing. This problen does not occure when i do not use the Web User Control. Here is the user control (.ascx) file code.

<script type="text/javascript" language="javascript">
    function OkClicked(sender, e) {
            __doPostBack('Button1', e);
        }
</script>

<asp:Button ID="Button2" runat="server" Text="Show" />
<asp:Panel ID="Panel1" runat="server">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</asp:Panel>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
    DropShadow="True" OkControlID="Button1" PopupControlID="Panel1" 
    TargetControlID="Button2" onokscript="OkClicked()">
</asp:ModalPopupExtender>  开发者_开发问答      
<p>
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</p>

And the Event Handeler for the click event of the 'Button1' is

protected void Button1_Click(object sender, EventArgs e)
{
    Label1.Text = TextBox1.Text;
}

In the javascript you shouldn't put 'Button1' as the name of the control. Instead, on the PreRender event of your control, fill that out with this.Button1.ClientID .

ClientID is the unique identifier across the entire generated page of your button control, allowing the server to pinpoint exactly what control triggered the postback.

If this wasn't like that, you wouldn't be able to place multiple instances of a same control on one page.

In code:

<script type="text/javascript" language="javascript">
function OkClicked(sender, e) {
        __doPostBack('<%= this.Button1.ClientID %>', e);
    }

Couple of suggestions:

1. Do you have any kind of validation on this page. If so, then it's possible that when you click the ok button, that validation is failing. When you click the button, likely the ModalPopup Extender will close, and if validation fails it may cancel the event happening. If this is the case, add an attribute: CausesValidation="false"

2. If that doesn't work, you may add an attribute to MAKE it post back, I believe there's an attribute -> AutoPostBack="true".

@Joachim is correct that you'll need to use the clientID, but at the same time, I don't think you'll need to call javascript to run the backend code.

Also, you may consider putting this into an UpdatePanel so that you do an AJAX postback without sending the entire page back and forth when the page is posted back.