Question

我正在开发一个将大量信息过滤到gridview中的项目，这个gridview位于一个更新面板中，我得到了RowDataBound事件，该事件被编程为在每一行上设置一个css类，因为这样做是manualy似乎没有工作..这个类被添加但我现在需要在tr上点击一个类。我一直在尝试使用jQuery，但它看起来似乎没有用（它完全适用于表外的元素）。

Fiddle of what I want

继承我的gridview

<asp:UpdatePanel ID="UpdatePanel5" runat="server">
    <ContentTemplate>
        <asp:GridView ID="gridTabla" runat="server" BorderColor="White" EnableSortingAndPagingCallbacks="True" GridLines="Horizontal" AutoGenerateColumns="False">
            <AlternatingRowStyle BackColor="#F0F0F0" BorderColor="#F0F0F0" BorderStyle="Solid" />
            <Columns>
                <asp:BoundField AccessibleHeaderText="codesc" DataField="CodEscuela" HeaderText="Cod" />
                <asp:BoundField AccessibleHeaderText="esc" DataField="Escuela" HeaderText="Escuela" />
                <asp:BoundField AccessibleHeaderText="codar" DataField="codCarrera" HeaderText="Cod" />
                <asp:BoundField AccessibleHeaderText="car" DataField="Carrera" HeaderText="Carrera" />
                <asp:BoundField AccessibleHeaderText="codmat" DataField="codMateria" HeaderText="Cod" />
                <asp:BoundField AccessibleHeaderText="materia" DataField="Materia" HeaderText="Materia" />
                <asp:BoundField AccessibleHeaderText="nom" DataField="Nomina" HeaderText="Nomina" />
                <asp:BoundField AccessibleHeaderText="prof" DataField="Profesor" HeaderText="Profesor" />
                <asp:BoundField AccessibleHeaderText="noalumnos" DataField="noAlumnos" HeaderText="Numero de alumnos" />
                <asp:BoundField AccessibleHeaderText="noregistros" DataField="noRegistros" HeaderText="Numero de Registros" />
                <asp:BoundField AccessibleHeaderText="periodo" DataField="Periodo" HeaderText="Periodo" />
                <asp:BoundField AccessibleHeaderText="np" DataField="NP" HeaderText="NP" />
                <asp:BoundField AccessibleHeaderText="ni" DataField="NI" HeaderText="NI" />
                <asp:BoundField AccessibleHeaderText="diez" DataField="Diez" HeaderText="10" />
                <asp:BoundField AccessibleHeaderText="nueve" DataField="Nueve" HeaderText="9" />
                <asp:BoundField AccessibleHeaderText="ocho" DataField="Ocho" HeaderText="8" />
                <asp:BoundField AccessibleHeaderText="siete" DataField="Siete" HeaderText="7" />
                <asp:BoundField AccessibleHeaderText="seis" DataField="Seis" HeaderText="6" />
                <asp:BoundField AccessibleHeaderText="cinco" DataField="Cinco" HeaderText="5" />
                <asp:BoundField AccessibleHeaderText="bantutor" DataField="BandTutor" HeaderText="Reportes de tutor" />
                <asp:BoundField AccessibleHeaderText="banddir" DataField="BandDirector" HeaderText="Reportes de director" />
            </Columns>
            <RowStyle BorderStyle="None" HorizontalAlign="Center" VerticalAlign="Middle" />
        </asp:GridView>
    </ContentTemplate>
</asp:UpdatePanel>

我的RowDataBound

Protected Sub gridTabla_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles gridTabla.RowDataBound
  e.Row.CssClass = "clickableTr"
End Sub

我的jQuery函数

$('.clickableTr').click(function () {
  $(this).toggleClass('activeTr');
});

我不确定我做错了什么，这完全适用于外表元素

Answer 1

您正在使用UpdatePanel，它会在回发时获得更新。但是你的javascript第一次注册了这个事件。发生更新时，事件注册消失。您需要使用on代替click来处理此问题。试试这个：

$(function(){
    $("#gridTabla").on("click", ".clickableTr", function(){
        $(this).toggleClass("activeTr");
    });
});

jQuery点击gridview tr上的函数

1 个答案: