如何从 Gridview 中的 LinkBut​​ton 触发 Onclick 事件驻留在 updatePanel 中？

Posted 2023-04-12

【中文标题】如何从 Gridview 中的 LinkBut​​ton 触发 Onclick 事件驻留在 updatePanel 中？

【英文标题】：How to fire Onclick event from LinkButton in Gridview resides in updatePanel?

【发布时间】：2019-07-23 09:55:12

【问题描述】：

我知道这可能以前被问过。我的 gridview 行根据从数据库中获取数据的搜索过滤器进行更改。但是当我点击链接按钮查看数据时，只有Onclientclick 被触发，onclick 没有被触发。

这是我的代码：

<form id="form1" runat="server">
      <asp:HiddenField runat="server" ID="Hf" />
      <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
      <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
    <ContentTemplate>  
     <label>  Show  <asp:DropDownList runat="server" CssClass="custom-select custom-select-sm form-control form-control-sm"
    ID="RecordSize" AutoPostBack="true" Style="width: 51.75px; height: 30.75px;">
    <asp:ListItem Value="10" Selected="True">10</asp:ListItem>
    <asp:ListItem Value="25">25</asp:ListItem>
    <asp:ListItem Value="50">50</asp:ListItem>    
      </asp:DropDownList>  entries</label> <asp:Label Style="margin-left: 10px;" runat="server" ID="lblerror" ForeColor="Red"></asp:Label>
    <div id="m_table_1_filter" class="dataTables_filter">
     <label>Search:</label>
     <asp:TextBox runat="server" ID="txtSearch" type="search" autocomplete="off"
      AutoPostBack="true" MaxLength="20" CssClass="form-control form-control-sm" OnTextChanged="txtSearch_TextChanged" Style="margin-top: -30px; margin-left: 65px; width: 250px;"></asp:TextBox> 
    </div>

     <div class="row" style="display: block;">
      <asp:GridView OnPageIndexChanging="MandateGrid_PageIndexChanging" runat="server"
    ID="MandateGrid" AutoGenerateColumns="false" OnRowDataBound="MandateGrid_RowDataBound"
    PageSize="5" Style="text-align: center;" AllowPaging="true" AllowSorting="true"
    CssClass="table table-striped- table-bordered table-hover table-checkable dataTable no-footer">
    <PagerSettings FirstPageText="<<" LastPageText=">>" Mode="NumericFirstLast" />
    <Columns>
     <asp:TemplateField HeaderText="ID" Visible="false">
      <ItemTemplate>
    <asp:Label ID="LabelID" runat="server" Text='<%# Eval("ID") %>'></asp:Label>
      </ItemTemplate>
     </asp:TemplateField>
     <asp:TemplateField HeaderText="Mandate Status">
      <ItemTemplate>
    <asp:LinkButton CommandArgument="Select" CommandName="Select" ID="btnView" runat="server" Text="View"
    CssClass="btn m-btn--square" OnClientClick="changeAnchor();" OnClick="btnView_Click" ></asp:LinkButton>
      </ItemTemplate>
     </asp:TemplateField> 
      </asp:GridView>
     </div>

    </ContentTemplate>
      </asp:UpdatePanel>
     </form>

这是我的 javascript 函数，我使用它只是为了检索我在我的方法中需要的当前列索引。 ：

function changeAnchor()             
            $(function () 
                $("[id*=MandateGrid]").find("[id*=btnView]").click(function ()                     
                    var row = $(this).closest("tr");                   
                    var message = "Row Index: " + (row[0].rowIndex - 1);
                    $("#Hf").val(row[0].rowIndex - 1);                    
                    //alert(message);
                    return false;
                );
            );

这是我的 onclick 事件：-

protected void btnView_Click(object sender, EventArgs e)
          
        lblerror.Text = "Event Fired";
    

如果我必须在这个问题中添加任何其他代码，请告诉我。

【参考方案1】：

您的设置是这样的，clientClick 处理程序注册了一个 clickhandler，clickhandler 对于您似乎试图做的事情似乎是不必要的。 （设置一个隐藏字段，以便您找出回发的目标行）。

由于事件是在恢复页面状态后处理的，因此您可以在btnView_Click 中使用 sender 来确定服务器端的行，而无需在此处使用 javascript。

尝试将 sender 转换为 Button，并在完全删除 OnClientClick 处理程序后在调试器中查看大量可用信息。

更直接地说，您的changeAnchor 函数不会返回函数，它会注册一个函数，以便在 jquery 准备好时运行。依次注册一个clickHandler，然后呈现与按钮匹配的html元素。您不应该这样做，每次呈现按钮时，您最终可能会为所有按钮注册相同的处理程序。最终的点击处理程序也返回 false，这会取消回发。

【讨论】：

假设我取消了 OnclientClick 事件，我只放置了 OnClick 事件。我可以这样做吗？如何 ？如果我设置触发器它说找不到关联的 Id。有什么想法吗？

我的主要目的是使用该按钮以模式显示信息。

什么是“它”，Id 与什么有什么关系？如何设置触发器？你的意思是断点吗？我没有足够老的 asp.net 项目来向您展示完整的代码。也许您可以先在服务器端或客户端之间进行选择，而不是混合使用。

不，我的意思是说，我有一个带有表单的模态。并在 Onclick 上将 id 发送到 db 并获取数据并显示为模态。但是单击时不会触发事件。这就是我要问的。我试过调试，但它没有进入调试模式，因为点击没有被触发。

点击不会触发，因为您在 javascript 中取消它，您返回 false，取消回发。去掉 javascript 和 onClientClick 属性，然后调试。