关闭模式在服务器端提交消息后弹出

时间:2018-04-25 13:00:25

标签: javascript c# jquery asp.net bootstrap-modal

我有bootstrap modal pop up。里面有很多控件和提交按钮。所以在成功提交后我想关闭那个弹出窗口。以下是将消息显示为Record Saved successfully的代码。

if (strMessage == "Success" && strSaveSubmit == "Draft")
            {
                ClientScript.RegisterStartupScript(Page.GetType(), "erroralert", "alert('Record Saved as Draft Successfully');", true);                    
            }

但是有了这个,我想关闭我无法解决的模态弹出窗口。这是div

<div class="modals">

        <form id="frmFileUpload" runat="server">
            <div class="col-sm-6">
                <asp:HiddenField ID="hdnFileInfo" runat="server" />
                <asp:HiddenField ID="hdnClose" runat="server" />
                <label>Sap ID</label>
                <asp:Label ID="lblSapId" Text="" runat="server" />
            </div>

            <div class="col-sm-6">
                <label>Candidate ID</label>
                <asp:Label ID="lblCandidateId" Text="" runat="server" />
            </div>

            <div class="col-sm-6">
                <label>Technical Feasible</label>
                <div class="selectWraper">
                    <asp:DropDownList ID="ddlTechFeasible" runat="server">
                        <asp:ListItem Text="Select" Value="Select" />
                        <asp:ListItem Text="YES" Value="YES" />
                        <asp:ListItem Text="NO" Value="NO" />
                    </asp:DropDownList>
                </div>
            </div>

            <div class="col-sm-6">
                <div class="upload">
                    <label>Upload Document</label>
                    <asp:HiddenField ID="hdnGetFileName" runat="server" />
                    <div id="dvFileUpload">
                        <asp:FileUpload runat="server" ID="flufileUpload" AllowMultiple="true" CssClass="chooseFile" />
                    </div>
                </div>
            </div>

            <div class="col-sm-6">
                <label>Remarks</label>
                <asp:TextBox ID="txtRemarks" runat="server" TextMode="MultiLine" />
            </div>
            <div class="col-sm-6" style="overflow: auto; height: 100px;">

                <asp:GridView ID="grdFilesInfo" runat="server" AutoGenerateColumns="false" EmptyDataText="No files uploaded">
                    <Columns>
                        <asp:BoundField DataField="Text" HeaderText="Uploaded Files" />
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:LinkButton ID="lnkDownload" ToolTip="download files" CssClass="fa fa-download" CommandArgument='<%# Eval("Value") %>' runat="server" OnClick="lnkDownload_Click"></asp:LinkButton>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:LinkButton ID="lnkDelete" ToolTip="delete files" CssClass="fa fa-trash-o" CommandArgument='<%# Eval("Value") %>' runat="server" OnClientClick="if (!confirm('Are you sure you want delete the file?')) return false;" OnClick="lnkDelete_Click" />
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </div>

            <div class="clearfix"></div>
            <div class="modalButton">

                <asp:Button ID="btnSaveDraft" runat="server" Text="Save as Draft" OnClick="btnSaveDraft_Click" CssClass="button" OnClientClick="return SaveOrDraft('Draft');" />

                <asp:Button ID="btnSubmit" runat="server" Text="Submit" data-dismiss="modal" OnClick="btnSubmit_Click" CssClass="button" OnClientClick="return SaveOrDraft('Draft');" />
            </div>
        </form>
    </div>

2 个答案:

答案 0 :(得分:2)

JQuery和Ajax是你的朋友。

你可以在document.ready中添加它......

$(document).ready(function() {
    $('#<%= btnSubmit.ClientID %>').on('click', function () {
        $('.modals').hide(); // hides anything with 'modals' as the class
    }
}

你也可以给模态一个ID并使用$('#ModalID')。hide(); 您可以为提交按钮分配静态ID,但&lt;%= btnSubmit.ClientID%&gt;会为你拿出身份证。

这是ajax操作吗?从您拥有的代码看起来它会执行回发并重新加载页面。

答案 1 :(得分:0)

&#13;
&#13;
if (strMessage == "Success" && strSaveSubmit == "Draft")
            {
                ClientScript.RegisterStartupScript(Page.GetType(), "erroralert", "alert('Record Saved as Draft Successfully');", true);  
ScriptManager.RegisterStartupScript(this, this.GetType(), "Popup", "closePopUP();", true);                
            }
            
function closePopUP(){

 $(".modals").modal('hide');
}
&#13;
&#13;
&#13;