Why Bootstrap modal is closing after bsave button click in asp.net
Hi,I have developed a form for comment confirmation. when i click add comment
my modal is going close. and also when i click save button is not checking validation
in asp.net
hi,
<asp:Content ID="Content1" ContentPlaceHolderID="cHead" runat="Server">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Page-Enter" content="Alpha(opacity=1.05)" />
<meta http-equiv="Page-Exit" content="Alpha(opacity=1.05)" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#<%=btnShowPopup.ClientID%>').live('click', function (e) {
$("#myModal").modal('show');
});
});
</script>
<script type="text/javascript">
function ValidComment() {
var Comment = document.getElementById('<%=btnShowPopup.ClientID%>').value;
if (Comment == "") {
alert("Hello");
}
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="mBody" runat="Server">
<asp:UpdatePanel ID="upMain" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:PostBackTrigger ControlID="bSave" />
<asp:PostBackTrigger ControlID="bNewComment" />
<asp:PostBackTrigger ControlID="btnShowPopup" />
</Triggers>
<ContentTemplate>
<asp:Button ID="btnShowPopup" runat="server" Text="Open Modal" OnClick="btnShowPopup_Click"
class="btn btn-primary btn-lg" />
<div id="myModal" class="modal fade" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">
Confirmation</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-sm-6 form-group">
<b>Comments</b>
<asp:Button ID="bNewComment" CssClass="btn btn-info" Text="Add Comment" runat="server"
data-toggle="modal" data-target="#myModal" OnClick="bNewComment_Click" />
</div>
</div>
<div class="row" id="dComment" runat="server" visible="false">
<div class="col-sm-6 form-group">
<b>Comments</b>
<asp:TextBox ID="tbComment" TextMode="MultiLine" Width="500px" runat="server" placeholder="Enter Comments.."
class="form-control"></asp:TextBox>
</div>
</div>
</div>
<div class="modal-footer">
<asp:Button ID="bClose" runat="server" CssClass="btn btn-primary" data-dismiss="modal"
Text="Close" />
<asp:Button ID="bSave" runat="server" CssClass="btn btn-primary" Text="Save changes"
OnClientClick="ValidComment()" />
</div>
</div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
code behind:
========
protected void bNewComment_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "myModals", "$('#myModal').modal('show')", true);
upMain.Update();
this.dComment.Visible = true;
}
protected void btnShowPopup_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "myModals", "$('#myModal').modal('show')", true);
}