jQuery循环通过ASP.NET gridview asp.net

Question

假设我的aspx页面中有gridview，而gridivew有很多行和3列。列是

选择 - 复选框，名字 - 文本框，姓氏 - 文本框等

我想通过jquery遍历gridview并从选中复选框的那行读取那些文本框值。

gridview看起来像

<asp:GridView
    id="GridView1"
    DataSourceID="srcMovies"
    DataKeyNames="Id"
    Runat="server" AutoGenerateColumns="false">

                                    

<asp:TemplateField>
    <ItemTemplate>
    <asp:Label ID="lblslno" runat="server" />    
    </ItemTemplate>
</asp:TemplateField>

<asp:TemplateField>
    <ItemTemplate>
    <asp:TextBox ID="txtFName" runat="server" />    
    </ItemTemplate>
</asp:TemplateField>

<asp:TemplateField>
    <ItemTemplate>
    <asp:TextBox ID="txtLName" runat="server" />    
    </ItemTemplate>
</asp:TemplateField>

</Columns>
</asp:GridView>   

如果选中了复选框，我获得了jquery代码来读取每行的文本框值...这里是代码

 <script type="text/javascript">
 $(document).ready(function () {
     var sum = 0;
     $('#btn1').click(function () {
         $('#tr').each(function () {
             if ($(this).find('input:checkbox').attr("checked"))
                 sum += parseInt($(this).find('input:text').attr("value"));
         });
         window.alert(sum.toString());
     });
 });
</script>

我担心的是如何从txtFName＆amp;读取数据。 txtLName文本框并在每行上标记lblslno。任何人都可以驾驶正确的代码。感谢

我得到了一个很好的解决方案....这里是

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script>
<script src="http://jquery-json.googlecode.com/files/jquery.json-2.2.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function() {
    var jsonData = new Array();
    $(".getJSON").click(function() {
        $.map($("table[id*=gvPurchaseOrderDetails] tr"), function(item, index) {
            if ($(item).find("input[type=text]").length>0) {
                jsonData[index] = new Object();
                jsonData[index].employeeid = $(item).find("input[type=text][id*=employeeid]").val();
                jsonData[index].employeename = $(item).find("input[type=text][id*=employeename]").val();
                jsonData[index].sex = $(item).find("select[id*=sex]").val();
                jsonData[index].graduate = $(item).find("input[type=checkbox][id*=graduate]").attr("checked");
            }
        });

        var jsonStringData = JSON.stringify(jsonData);
    });
});

<asp:GridView ID="gvPurchaseOrderDetails" runat="server"
    AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="employeeid">
            <ItemTemplate>
                <asp:TextBox ID="employeeid" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="employeename">
            <ItemTemplate>
                <asp:TextBox ID="employeename" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
       <asp:TemplateField HeaderText="sex">
            <ItemTemplate>
                <asp:DropDownList ID="sex" runat="server" ><asp:ListItem>Male</asp:ListItem><asp:ListItem>Female</asp:ListItem></asp:DropDownList>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Is Graduate">
            <ItemTemplate>
                <asp:CheckBox ID="graduate" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<a class="getJSON" href="#">get json data</a>

Answer 1

GridView将破坏文本框的ID。最简单的方法是在文本框中添加一个css类，然后使用它来查找它们：

<asp:TemplateField>
    <ItemTemplate>
        <asp:TextBox ID="txtFName" CssClass="FName" runat="server" />    
    </ItemTemplate>
</asp:TemplateField>

<asp:TemplateField>
    <ItemTemplate>
        <asp:TextBox ID="txtLName" CssClass="LName" runat="server" />    
    </ItemTemplate>
</asp:TemplateField>

编辑：根据评论中的建议，可以使用类选择器找到它们：

$(this).find('.LName').val()