I have a login control inside an update panel which is not firing the async postback.
Here is the code:
<div class="login-tabs"><ul class="login-ul-tabs"><li> <a href="#tab-signin">Sign in</a></li><li> <a href="#tab-register">Sign up</a></li></ul><div id="tab-signin" class="login-container"><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><h2 class="h2-member">Sign in</h2><p class="member-p">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut eget sollicitudin nibh. Duis semper, diam sed iaculis dictum, libero erat molestie dui, ac suscipit felis leo sed ipsum. </p><div class="login-inner"><asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Login ID="Login1" runat="server" CssClass="login-form" ><LayoutTemplate><asp:Literal ID="FailureText" runat="server" EnableViewState="False" ></asp:Literal> <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName" CssClass="labels" >User name:</asp:Label><asp:TextBox ID="UserName" runat="server" CssClass="textboxes" ></asp:TextBox><asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" ErrorMessage="Il nome utente è obbligatorio." ToolTip="Il nome utente è obbligatorio." ValidationGroup="Login1" enableclientscript="False" >*</asp:RequiredFieldValidator><asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" CssClass="labels">Password:</asp:Label><asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="textboxes"></asp:TextBox><asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" ErrorMessage="La password è obbligatoria." ToolTip="La password è obbligatoria." ValidationGroup="Login1" enableclientscript="False" >*</asp:RequiredFieldValidator><div class="button-container"><asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Signin" ValidationGroup="Login1" CssClass="button"/></div></LayoutTemplate></asp:Login></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="Login1$LoginButton" /></Triggers></asp:UpdatePanel><p>No account? <span><a href="#tab-register">Start here</a></span></p></div></div><div id="tab-register" class="login-container"><h2 class="h2-member">Sign up</h2><p class="member-p">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut eget sollicitudin nibh. Duis semper, diam sed iaculis dictum, libero erat molestie dui, ac suscipit felis leo sed ipsum. </p><div class="create-users"></div></div></div>
Both controls are located inside a Jquery tab.
The Jquey code is the following:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script><script>$(document).ready(function () {$(".membership-link").click(function () {$("#membership").slideDown(10); }); });$('#membership, .membership-link').click(function (e) { e.stopPropagation(); });$(document).click(function () { //$('.headerLogin').hide(); $("#membership").slideUp(10); }); </script><script>$('ul.login-ul-tabs').each(function () { // For each set of tabs, we want to keep track of // which tab is active and it's associated content var $active, $content, $links = $(this).find('a'); // If the location.hash matches one of the links, use that as the active tab. // If no match is found, use the first link as the initial active tab. $active = $($links.filter('[href="' + location.hash + '"]')[0] || $links[0]);$active.addClass('active');$content = $($active[0].hash); // Hide the remaining content $links.not($active).each(function () {$(this.hash).hide(); }); // Bind the click event handler $(this).on('click', 'a', function (e) { // Make the old tab inactive.$active.removeClass('active');$content.hide(); // Update the variables with the new link and content $active = $(this);$content = $(this.hash); // Make the tab active. $active.addClass('active');$content.show(); // Prevent the anchor's default click action e.preventDefault(); }); }); </script>
Anyone has any idea about what it can be wrong?
Thanks