简体   繁体   English

ASPX页面中的jQuery函数问题

[英]jQuery function in ASPX page issue

I have a jQuery function called ShowPopup that opens a modal popup box when clicked. 我有一个名为ShowPopup的jQuery函数,单击该函数会打开一个模式弹出框。 This works fine, however when I click the 'Cancel' button on the modal, it doesn't close. 效果很好,但是当我单击模式上的“取消”按钮时,它没有关闭。

It should be calling the jQuery function btnClose , but nothing ever happens. 它应该调用jQuery函数btnClose ,但是什么也没有发生。
It's being called twice in the asp code. 在ASP代码中被两次调用。

Any help would be appreciated, thanks. 任何帮助,将不胜感激,谢谢。

The jQuery code: jQuery代码:

   <script type="text/javascript" language="javascript">

       function ShowPopup() {
        $('#mask').show();
        $('#<%=pnlpopup.ClientID %>').show();
    }
    function HidePopup() {
        $('#mask').hide();
        $('#<%=pnlpopup.ClientID %>').hide();
    }


       $('.btnClose').on('click', function () {
           HidePopup();
       });
</script>

The ASP code where btnClose is clicked and called: 单击并调用btnClose的ASP代码:

<body>
<form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>
                        <asp:GridView ID="Grd" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"  style="table-layout:fixed;" Width="1000px"
                            OnRowDataBound="Grd_RowDataBound"  OnRowCommand="Grd_RowCommand">
                            <Columns>
                                <asp:ButtonField CommandName="ColumnClick" Visible="false" />  
                                <asp:BoundField DataField="Month" HeaderText="Month" SortExpression="Month" HeaderStyle-Width="60px" />
                                <asp:BoundField DataField="1" HeaderText="1" SortExpression="1"  />
                                <asp:BoundField DataField="2" HeaderText="2" SortExpression="2"  />
                                <asp:BoundField DataField="3" HeaderText="3" SortExpression="3" />
                                <asp:BoundField DataField="4" HeaderText="4" SortExpression="4" />
                                <asp:BoundField DataField="5" HeaderText="5" SortExpression="5" />
                                <asp:BoundField DataField="6" HeaderText="6" SortExpression="6" />
                                <asp:BoundField DataField="7" HeaderText="7" SortExpression="7" />
                                <asp:BoundField DataField="8" HeaderText="8" SortExpression="8" />
                                <asp:BoundField DataField="9" HeaderText="9" SortExpression="9" />
                                <asp:BoundField DataField="10" HeaderText="10" SortExpression="10" />
                                <asp:BoundField DataField="11" HeaderText="11" SortExpression="11" />
                                <asp:BoundField DataField="12" HeaderText="12" SortExpression="12" />
                                <asp:BoundField DataField="13" HeaderText="13" SortExpression="13" />
                                <asp:BoundField DataField="14" HeaderText="14" SortExpression="14" />
                                <asp:BoundField DataField="15" HeaderText="15" SortExpression="15" />
                                <asp:BoundField DataField="16" HeaderText="16" SortExpression="16" />
                                <asp:BoundField DataField="17" HeaderText="17" SortExpression="17" />
                                <asp:BoundField DataField="18" HeaderText="18" SortExpression="18" />
                                <asp:BoundField DataField="19" HeaderText="19" SortExpression="19" />
                                <asp:BoundField DataField="20" HeaderText="20" SortExpression="20" />
                                <asp:BoundField DataField="21" HeaderText="21" SortExpression="21" />
                                <asp:BoundField DataField="22" HeaderText="22" SortExpression="22" />
                                <asp:BoundField DataField="23" HeaderText="23" SortExpression="23" />
                                <asp:BoundField DataField="24" HeaderText="24" SortExpression="24" />
                                <asp:BoundField DataField="25" HeaderText="25" SortExpression="25" />
                                <asp:BoundField DataField="26" HeaderText="26" SortExpression="26" />
                                <asp:BoundField DataField="27" HeaderText="27" SortExpression="27" />
                                <asp:BoundField DataField="28" HeaderText="28" SortExpression="28" />
                                <asp:BoundField DataField="29" HeaderText="29" SortExpression="29" />
                                <asp:BoundField DataField="30" HeaderText="30" SortExpression="30" />
                                <asp:BoundField DataField="31" HeaderText="31" SortExpression="31" />
                                <asp:TemplateField HeaderText="" SortExpression="">
                    <ItemTemplate>
                        <asp:LinkButton ID="LinkButtonEdit" runat="server" CommandName="ShowPopup"
                        CommandArgument='<%#Eval("Month") %>'>Edit</asp:LinkButton>
                    </ItemTemplate>
                </asp:TemplateField>
                            </Columns>
                        </asp:GridView>
                    </td>
                    <td valign="top">
                        <table>
                            <tr>
                                <td>
                                    <strong>
                                    Selected Row Index:</strong>
                                    <asp:Label ID="lblSelectedRow" runat="server" ForeColor="Red"></asp:Label>
                                </td>
                            </tr>
                             <tr>
                                <td>
                                    <strong>
                                    Selected Column Index:</strong>
                                    <asp:Label ID="lblSelectedColumn" runat="server" ForeColor="Red"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <strong>
                                    Selected Column Title:</strong>
                                    <asp:Label ID="lblSelectedColumnTitle" runat="server" ForeColor="Red"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <strong>
                                    Selected Column Value:</strong>
                                    <asp:Label ID="lblSelectedColumnValue" runat="server" ForeColor="Red"></asp:Label>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
         <div id="mask">
    </div>
      <asp:Panel ID="pnlpopup" runat="server"  BackColor="White" Height="175px"
            Width="300px" Style="z-index:111;background-color: White; position: absolute; left: 35%; top: 12%; border: outset 2px gray;padding:5px;display:none">
            <table width="100%" style="width: 100%; height: 100%;" cellpadding="0" cellspacing="5">
                <tr style="background-color: #0924BC">
                    <td colspan="2" style="color:White; font-weight: bold; font-size: 1.2em; padding:3px"
                        align="center">
                        Customer Details <a id="closebtn" style="color: white; float: right;text-decoration:none" class="btnClose"  href="#">X</a>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="width: 45%; text-align: center;">
                        <asp:Label ID="LabelValidate" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td align="right" style="width: 45%">
                        CustomerID:
                    </td>
                    <td>
                        <asp:Label ID="lblID" runat="server"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td align="right">
                        Contact Name:
                    </td>
                    <td>
                        <asp:Label ID="lblContactName" runat="server"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td align="right">
                        Address:
                    </td>
                    <td>
                        <asp:TextBox ID="txtAddress" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td align="right">
                        City:
                    </td>
                    <td>
                        <asp:TextBox ID="txtCity" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                        <%--<asp:Button ID="btnUpdate" CommandName="Update" runat="server" Text="Update" OnClick="btnUpdate_Click" />--%>
                        <input type="button" class="btnClose" value="Cancel" />
                    </td>
                </tr>
            </table>
        </asp:Panel>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:connstring %>" SelectCommand="sp_calendar" SelectCommandType="StoredProcedure"></asp:SqlDataSource>
</form>

Got it as I was typing this out. 在我输入此内容时知道了。 Added onclick attribute and called HidePopup() from it. 添加了onclick属性,并从中调用了HidePopup()。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM