2012-09-14 67 views
0

我想使用jQuery手风琴在我ASP.NEt Appliacation和它的作品,但如果我点击的手风琴一个按钮,然后我的手风琴删除:(这里我的代码和两个pitures ...为什么我的jQuery Accordion在按钮点击后删除?

ASPX:

<link href="App_Theme/mainStyle.css" type="text/css" rel="Stylesheet" /> 
    <script src="Scripte/jquery-1.8.0.min.js" type="text/javascript"></script> 
    <script src="Scripte/jquery-ui-1.8.23.custom.min.js" type="text/javascript"></script> 
    <link href="App_Theme/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css"/> 

    <script type="text/javascript" language="javascript"> 

     $(document).ready(function() { 
      $("#accordion").accordion(); 

     }); 

    </script> 

</head> 
<body> 
    <form id="form1" runat="server"> 

    <asp:ToolkitScriptManager ID="manager" runat="server"></asp:ToolkitScriptManager> 
    <asp:UpdatePanel ID="update" runat="server"> 
    <ContentTemplate> 

    <div id="accordion"> 
      <h3><a href="#"><asp:Label ID="lblAbwesenheit" runat="server"/></a></h3> 
      <div> 
       <asp:Panel runat="server" ID="pn1" DefaultButton="btnAbwesenheitErzeugen"> 
          <div id="Angaben" runat="server"> 

          <table id="Angabentabelle" runat="server"> 

           <tr> 
           <td><asp:Label ID="lblAbwesenheitBis" runat="server" /></td><td><asp:TextBox ID="txtAbwesenheitBis" runat="server" Enabled="false"></asp:TextBox> 
           <asp:ImageButton Width="20px" Height="20px" ID="imgbtnAbwesenheitBis" runat="server" ToolTip="Abwesenheit bis..." ImageUrl="~/App_Theme/Calender.ico" /> 
           <asp:CalendarExtender ID="AbwesenheitBis" runat="server" TargetControlID="txtAbwesenheitBis" 
           Format="dd.MM.yyyy" PopupButtonID="imgbtnAbwesenheitBis"></asp:CalendarExtender> 
           </td> 
           </tr> 

           <tr> 
           <td><asp:Label ID="lblVertreter" runat="server" /></td> 
           <td> 
           <asp:TextBox ID="txtVertreter" runat="server"></asp:TextBox> 
           <asp:AutoCompleteExtender ID="AutoComlete" runat="server" TargetControlID="txtVertreter" 
           ServiceMethod="GetCompletionList" ServicePath="" Enabled="true" 
           DelimiterCharacters="" UseContextKey="true" MinimumPrefixLength="1" ></asp:AutoCompleteExtender> 
           (Suche nach Nachname) 
           </td> 

           </tr> 
          </table> 

           <asp:Button ID="btnAbwesenheitErzeugen" runat="server" Text="Erzeugen" OnClick="btnAbwesenheitErzeugen_Click" /> 
           <br /> 
          <br /> 

          </div> 

          <HTMLEditor:Editor ID="htmlEditAbwesenheit" runat="server" Content="<% %>" /> 

          </asp:Panel> 
      </div> 
      <h3><a href="#"><asp:Label ID="lblSignatur" runat="server" /></a></h3> 
      <div> 
       <HTMLEditor:Editor ID="htmlEditSignatur" runat="server" Content="<% %>" /> 
      </div> 
     </div> 

如果我开始我的网页我看到:

enter image description here

,如果我点击按钮,然后我看到......

enter image description here

为什么要删除我的手风琴?

回答

2

这是因为你的手风琴是在一个更新面板里面的。当您回发时,您的updatepanel中的所有内容都将从DOM中删除并重新读取。因此,手风琴的DOM元素消失了。你需要调用:$(“#accordion”)。accordion();回发之后。你能做到这

一种方法是做到这一点:

<script type="text/javascript" language="javascript"> 
    function SetupAccordion(){ 
     $("#accordion").accordion(); 
    } 
    $(document).ready(function() { 
    SetupAccordion(); 
    if (typeof Sys.WebForms != 'undefined') { 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(SetupAccordion); 
    } 
    }); 
</script>