模态弹出控件不起作用

时间:2016-05-26 21:12:26

标签: javascript jquery html asp.net bootstrap-modal

我是哈里克里希纳。我正在asp.net中开发一个应用程序。在这里,我必须在一个div中添加客户详细信息,并使用弹出窗口添加他们的地址和联系人。因此,当添加地址弹出时,我的保存按钮单击事件正在触发,它正常工作。但是,当我点击Save in Contact Pop up时,弹出窗口正在关闭,没有动作正在执行,只是我的弹出窗口正在关闭。当我观察到URL时,链接会在我的弹出控件中添加控件ID,如下所示

Image Changing the URL after Clicking the Save Button in POP UP Window

以下是我的代码。你可以检查代码,让我知道我失踪的地方,我从一周后就被打到了这里。

        <!--Popup Start for Address-->

    <asp:HiddenField ID="hdn_Address" runat="server" />
    <ajaxToolkit:ModalPopupExtender ID="mdl_pop_Address" runat="server" TargetControlID="hdn_Address"
        PopupControlID="pnl_Address" Drag="false" BackgroundCssClass="modalBackground">
    </ajaxToolkit:ModalPopupExtender>
    <asp:UpdatePanel ID="uppnl_Pop_Address" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <asp:Panel ID="pnl_Address" runat="server" Style="display: none;">
                <%--<div class="modal fade" id="addresstable" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">--%>
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                            <h3 class="modal-title" id="lineModalLabel">Address</h3>
                        </div>
                        <div class="modal-body">

                            <!-- content goes here -->
                            <div class="row">
                                <div class="col-md-12">
                                    <form class="form-horizontal" role="form">

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Address Number :</label>
                                            <div class="col-sm-9">
                                                <asp:TextBox ID="txtAddressNum" runat="server" CssClass="form-control" placeholder="Customer Name"></asp:TextBox>
                                                <%--<input type="text" placeholder="Customer Name" class="form-control" />--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Address type:</label>
                                            <div class="col-sm-9">
                                                <asp:DropDownList runat="server" ID="ddlAddressType" CssClass="form-control">
                                                    <asp:ListItem Value="Billing">Billing</asp:ListItem>
                                                    <asp:ListItem Value="Service">Service</asp:ListItem>
                                                    <asp:ListItem Value="Contact">Contact</asp:ListItem>
                                                </asp:DropDownList>
                                                <%--<select name="address" id="address" class="form-control">
                                                    <option value="">Billing</option>
                                                    <option value="" selected="">Service</option>
                                                </select>--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Address Line 1:</label>
                                            <div class="col-sm-9">
                                                <asp:TextBox ID="txtAddressLine1" runat="server" CssClass="form-control" placeholder="Address Line 1"></asp:TextBox>
                                                <%--<input type="text" placeholder="Address Line 1" class="form-control" />--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Address Line 2:</label>
                                            <div class="col-sm-9">
                                                <asp:TextBox ID="txtAddressLine2" runat="server" CssClass="form-control" placeholder="Address Line 2"></asp:TextBox>
                                                <%--<input type="text" placeholder="Address Line 2" class="form-control" />--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">City:</label>
                                            <div class="col-sm-9">
                                                <asp:TextBox ID="txtCity" runat="server" CssClass="form-control" placeholder="City"></asp:TextBox>
                                                <%--<input type="text" placeholder="City" class="form-control" />--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">State:</label>
                                            <div class="col-sm-5">
                                                <select name="bill_state" runat="server" id="bill_state" onchange="bill_state_changed(this);" class="form-control">
                                                    <option value="AN">Andaman and Nicobar Islands (AN)</option>
                                                    <option value="AP" selected="">Andhra Pradesh (AP)</option>
                                                    <option value="AR">Arunachal Pradesh (AR)</option>
                                                    <option value="UL">Uttaranchal (UL)</option>
                                                    <option value="WB">West Bengal (WB)</option>
                                                </select>
                                            </div>

                                            <label class="col-sm-2 control-label" for="textinput">Zip code :</label>
                                            <div class="col-sm-2">
                                                <asp:TextBox ID="txt_Zip" runat="server" CssClass="form-control" placeholder="Zip"></asp:TextBox>
                                                <%--<input type="text" placeholder="Post Code" class="form-control">--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Country</label>
                                            <div class="col-sm-9">
                                                <select name="bill_country" id="bill_country" runat="server" onchange="bill_country_changed(this); " class="form-control">
                                                    <option value="IN" selected="">India (IN) </option>
                                                    <option value="AN">(AN) </option>
                                                    <option value="FX">(FX) </option>
                                                    <option value="CS">(CS) </option>
                                                    <option value="ZW">Zimbabwe (ZW) </option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Is Primary:</label>
                                            <div class="col-sm-9">
                                                <asp:CheckBox ID="chk_Is_Primary_Address" runat="server" />
                                                <%--<input type="checkbox" style="margin-top: 12px;" checked="">--%>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <div class="col-sm-offset-2 col-sm-10">
                                                <div class="pull-right">
                                                    <asp:Button ID="btn_Save_Address" runat="server" OnClick="btn_Save_Address_Click" CssClass="btn btn-primary" Text="Save" />
                                                    <asp:Button ID="btn_Cancel_Save_Address" runat="server" OnClick="btn_Cancel_Save_Address_Click" CssClass="btn btn-default" Text="Cancel" />
                                                    <%--<button type="submit" class="btn btn-default">Cancel</button>
                                                    <button type="submit" class="btn btn-primary">Save</button>--%>
                                                </div>
                                            </div>
                                        </div>

                                    </form>
                                </div>
                                <!-- /.col-lg-12 -->
                            </div>
                            <!-- /.row -->

                        </div>
                    </div>
                </div>

            </asp:Panel>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btn_Save_Address" />
        </Triggers>
    </asp:UpdatePanel>

    <!--Popup End for Address-->

    <!--Popup Start for Contacts-->

    <asp:HiddenField ID="hdn_Contact" runat="server" />
    <ajaxToolkit:ModalPopupExtender ID="mdl_pop_Save_Contact" runat="server" TargetControlID="hdn_Contact"
        PopupControlID="pnl_Contact" Drag="false" BackgroundCssClass="modalBackground">
    </ajaxToolkit:ModalPopupExtender>
    <asp:UpdatePanel ID="uppnl_Save_Contact" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <asp:Panel ID="pnl_Contact" runat="server" Style="display: none;">
                <%--<div class="modal fade" id="addresstable" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">--%>
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                            <h3 class="modal-title" id="H1">Contacts</h3>
                        </div>
                        <div class="modal-body">

                            <!-- content goes here -->
                            <div class="row">
                                <div class="col-md-12">
                                    <form class="form-horizontal" role="form">

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Customer Name:</label>
                                            <div class="col-sm-9">
                                                <input type="text" placeholder="Customer Name" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Contact type:</label>
                                            <div class="col-sm-9">
                                                <select name="" id="" class="form-control">
                                                    <option value="">Billing</option>
                                                    <option value="" selected="">Service</option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Mobile:</label>
                                            <div class="col-sm-9">
                                                <input type="text" placeholder="Mobile Number" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Landline:</label>
                                            <div class="col-sm-9">
                                                <input type="text" placeholder="Landline Number" class="form-control">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Email:</label>
                                            <div class="col-sm-9">
                                                <input type="email" placeholder="Email" class="form-control">
                                            </div>
                                        </div>





                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="textinput">Is Primary:</label>
                                            <div class="col-sm-9">
                                                <input type="checkbox" style="margin-top: 12px;" checked="">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <div class="col-sm-offset-2 col-sm-10">
                                                <div class="pull-right">
                                                    <asp:Button ID="btn_SaveContact" runat="server" OnClick="btn_SaveContact_Click" CssClass="btn btn-primary" Text="Save" />
                                                    <asp:Button ID="btn_Cancel_Save_Contact" runat="server" OnClick="btn_Cancel_Save_Contact_Click" CssClass="btn btn-default" Text="Cancel" />
                                                    <%--                                    <button type="submit" class="btn btn-default">Cancel</button>
                                <button type="submit" class="btn btn-primary">Save</button>--%>
                                                </div>
                                            </div>
                                        </div>

                                    </form>
                                </div>
                                <!-- /.col-lg-12 -->
                            </div>
                            <!-- /.row -->

                        </div>
                    </div>
                </div>

            </asp:Panel>
        </ContentTemplate>
        <Triggers>
            <asp:PostBackTrigger ControlID="btn_SaveContact" />
        </Triggers>
    </asp:UpdatePanel>

    <!--Popup End for Contacts-->

1 个答案:

答案 0 :(得分:2)

您可以首先确保在代码中为&#34; btn_SaveContact_Click&#34; &#34; btn_Cancel_Save_Contact_Click&#34; 通过在代码中删除一些断点并在调试模式下运行。希望它有所帮助。