Question

I am trying to use a ajaxToolkit:TabContainer in an AJAX modal popup. The problem is that I get a javascript error in Internet Explorer 8. It does work in Internet Explorer 9 and in Firefox!

htmlfile: Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus.

I don’t get the error if I display the modal popup by default, or if I delete all ajaxToolkit:TabPanel elements in the ajaxToolkit:TabContainer.

Is there an option on the TabContainer to somehow not set a focus?

Here is an example that can be used to reproduce the problem with test.aspx

<asp:UpdatePanel ID="upSystem" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <h2>Test</h2>

        <asp:Button ID="cmdPopup" runat="server" CssClass="button btn" Text="Neuen Eintrag erfassen" OnClick="CmdPopupOpen" />

            <asp:Panel ID="panList" runat="server"  CssClass="modalPopup" Width="500px">

                <asp:UpdatePanel ID="upDetail" runat="server" UpdateMode="Conditional">
                    <ContentTemplate>

                            <asp:UpdatePanel ID="upData" runat="server" UpdateMode="Conditional">
                                <ContentTemplate>
                                        <br />
                                        <div class="modal">
                                        <div id="divHeader" runat="server" class="modal-header"><h2 class="messageboxh2">Task Messages</h2></div>



                                        <div class="modal-body">
                                            <asp:Label ID="Label1" runat="server" Text="Task Typ: " />
                                            <asp:DropDownList ID="ddlTaskType" runat="server">

                                            </asp:DropDownList>
                                        <br /><br />
                                       <ajaxToolkit:TabContainer ID="tConNew" runat="server" Height="150px" 
                                              >
                                            <ajaxToolkit:TabPanel runat="server" ID="tPanInstant" HeaderText="Sofort" >
                                                <ContentTemplate>
                                                </ContentTemplate>

                                            </ajaxToolkit:TabPanel>

                                        </ajaxToolkit:TabContainer>
                                </ContentTemplate>
                            </asp:UpdatePanel>     
                        <div class="modal-footer">
                                <br/>
                                <asp:Button ID="cmdClose" runat="server" CssClass="btn" Text="Abbrechen" />
                                <asp:Button ID="cmdSave" runat="server" CssClass="btn" Text="Speichern" onclick="MpeSave" />
                        </div>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </asp:Panel>


            <ajaxToolkit:ModalPopupExtender ID="mdlPopup" runat="server" 
                    TargetControlID="lblDummyUpload"
                    PopupControlId="panList" 
                    BackgroundCssClass="modalBackground" 
                    PopupDragHandleControlID="divHeader" 
                    RepositionMode="None" 
                    CancelControlID="cmdClose"
                     />

            <asp:Button id="lblDummyUpload" runat="server" style="display:none" />  


    </ContentTemplate>        
</asp:UpdatePanel>

and the test.aspx.cs

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

    }

    protected void MpeSave(object sender, EventArgs e)
    {
        mdlPopup.Hide();
    }

    protected void CmdPopupOpen(object sender, EventArgs e)
    {
        mdlPopup.Show();
    }
}

Answer 1

I could “fix” the bug by using an older version of the AJAX Control Toolkit as suggested here: http://ajaxcontroltoolkit.codeplex.com/workitem/27051