jquery - Auto-Close AJAX inserted bootstrap alert messages? -
i'm having hard time getting bootstrap alert messages auto-close.
alert ui
<div class="alert-message fade in info " runat="server" id="alertmessage"> <div class="box-icon"></div> <p> <asp:label id="lblmsg" runat="server" text="test"></asp:label> <a href="#" class="close" >×</a> </p> </div>
vb code-behind
lblmsg.text = message alertmessage.attributes.add("class", "alert-message fade in info") radajaxpanel_alerts.responsescripts.add(string.format("$find('{0}').ajaxrequest();", radajaxpanel_alerts.clientid))
javascript
$(document).ready(function () { $(".close").click(function () { $(".alert-message").alert('close'); }); }); $(".alert-message").delay(5000).fadeto(900, 0).slideup(500, function () { $(this).remove(); });
you can see when page requests alert shown ajax panel updated. unless full page reload panel not auto-close. assumption js ran , did not find div since not in dom @ time. can't quite figure rest out.
javascript inside update panel placing javascript inside update panel cause triggered when update panel triggered. induces new issue. if page postback div shown, .ajaxrequest(); call, causing div shown again.
change code this:
$(".alert-message").delay(5000).fadeout(1000);
Comments
Post a Comment