如何制作按鈕單擊事件處理程序工作？

Question

我將gridView鏈接按鈕鏈接到模式彈出窗口，如下所示：

 <asp:TemplateField HeaderText="Analyze">
                                 <ItemTemplate>
                                       <asp:LinkButton Text="Analyze" ID="lnkView" runat="server" ControlStyle-Font-Underline="true"  />
                                 </ItemTemplate>
                             </asp:TemplateField>

模態彈出窗口的代碼如下：

 <div id="dialog" style="display: none">
            <div style="text-align:center">
                 <asp:Label ID="Label12" runat="server" Text="Result Id:" />
                <asp:TextBox ID="tb" runat="server" Value="102" />
            </div>
            <br />
            <div>
                <asp:Label runat="server" Text="Bug Id:" />
                <asp:TextBox runat="server" id="bugidtb" Value="Enter Bug Id:"/>
            </div>
            <br />
            <div>
                <asp:Label ID="Label11" runat="server" Text="Bug DB:" />
                <asp:DropDownList runat="server" Width="250px" ID="Bugdb" >
                    <asp:ListItem>OneBug</asp:ListItem>
                    <asp:ListItem>Jira</asp:ListItem>
                </asp:DropDownList>
            </div>
            <br/><br/>
            <asp:Button runat="server" Text="OK" OnClick="ModalOK_Click"/>
            <asp:Button runat="server" Text="Cancel" />
            <asp:Label runat="server" ID="test" Text="hello world" />

        </div>


      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
        <link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css"
            rel="stylesheet" type="text/css" />
        <script type="text/javascript">
            $(document).on("click", "[id*=lnkView]", function () {

                $("#resultId").html($(".ResultId", $(this).closest("tr")).html());
                $("#dialog").dialog({
                    title: "Analyze Result",
                    modal: true
                });
                return false;
            });
        </script>

模態中的按鈕單擊事件處理程序代碼未執行。 我進行了調試，發現事件處理程序根本沒有響應。

我如何使其工作？

Answer 1

可能的問題是你的jquery腳本無法找到事件未觸發的id。

嘗試使用

     '<%=lnkView.ClientID%>' 

這將非常快，因為它將使用本機document.getElementById 。

在你的選擇器中。
要么
嘗試使用jquery結束選擇器，

          input[id$='lnkView']

您還可以使用jquery選擇器ends with使用input[id$='lnkView']獲取lnkView服務器生成的id。 另外， $("[id$=lnkView]")將選擇多個元素，因此如果您將相同的id分配給多個元素，並且如果您想遍歷所有元素，那么第一個案例將無法正常工作。

但我會采用第一種方法。 因為服務器控件id生成模式是你不想依賴的東西。

Answer 2

更好嘗試在鏈接按鈕標簽本身中調用click事件，因為在網格視圖中放置的按鈕，鏈接按鈕，圖像等無法通過javascript識別。

function Analyse(){

            $("#resultId").html($(".ResultId", $(this).closest("tr")).html());
            $("#dialog").dialog({
                title: "Analyze Result",
                modal: true
            });
            return false;
        }

將屬性OnClientClick =“Analyze（）”添加到鏈接按鈕