通过ASP循环：使用JavaScript GridView的数据 [英] Looping through asp:GridView data using javascript

问题描述

首先，是它甚至有可能通过数据环路在 ASP：GridView控件在客户端使用的的JavaScript 如果是的，我想知道该怎么做...

First of all, is it even possible to loop through the data in an asp:GridView at Client-side using JavaScript. If Yes, I would like to know how to do that...

至于我打算捕捉网格2字段的值，并在各行​​其价值的基础上附加一个图像（这部分应该不会造成太大的问题，一旦我可以遍历数据并加以比较的）。

As I intend to capture the values of 2 fields on the Grid and attach an image on each row on the basis of their value(that part shouldn't pose much of a problem once I can loop through the data and compare them).

我的网看起来像这个

 <asp:GridView ID="GridView1" runat="server" EmptyDataText="No Record Found" AllowSorting="true"
        AllowPaging="false" OnRowCreated="GridView1_RowCreated" Visible="true" BackColor="ButtonShadow"
        OnSorting="GridView1_Sort" AutoGenerateColumns="false" GridLines="None" >
        <Columns>
            </asp:TemplateField>
            <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
            <asp:BoundField DataField="Gender" HeaderText="Gender" SortExpression="Gender" />
            <asp:BoundField DataField="Age" HeaderText="Age" SortExpression="Age" />
            <asp:BoundField DataField="Type" HeaderText="Type" SortExpression="Type" />
            <asp:BoundField DataField="Exam" HeaderText="Exam" SortExpression="Exam" />
            <asp:BoundField DataField="DateTime" HeaderText="DateTime" SortExpression="DateTime" />
            <asp:BoundField DataField="Status" HeaderText="Status" SortExpression="Status" />
            <asp:BoundField DataField="Priority" HeaderText="Priority" SortExpression="Priority" />
        </Columns>
    </asp:GridView>

的如果我是场上直：的我如何捕获的性别的和的年龄的每一行

If I pitch it straight: How do I capture Gender and Age for each row?

P.S。我打开 JQuery的的解决方案太.......

P.S. I am open to JQuery solutions too.......

推荐答案

既然你在GridView的 ID ，可以抢在JavaScript中的元素，通过迭代其行，然后将行'细胞，检查索引1（性别）或2（年龄），并获得了的innerHTML 来获得内容。在这看看：

Since you have the id of the gridview, you can grab the element in Javascript, iterate through its rows, and then the rows' cells, checking for index 1 (gender) or 2 (age), and get its innerHTML to get the contents. Take a look at this:

window.onload = function () {
    var table, tbody, i, rowLen, row, j, colLen, cell;

    table = document.getElementById("GridView1");
    tbody = table.tBodies[0];

    for (i = 0, rowLen = tbody.rows.length; i < rowLen; i++) {
        row = tbody.rows[i];
        for (j = 0, colLen = row.cells.length; j < colLen; j++) {
            cell = row.cells[j];
            if (j == 1) {
                // Gender
                console.log("--Found gender: " + cell.innerHTML);
            } else if (j == 2) {
                // Age
                console.log("--Found age: " + cell.innerHTML);
            }
        }
    }
};

DEMO： http://jsfiddle.net/ZRXV3/

这肯定取决于所呈现的，虽然你的HTML的结构。有可能永远是一个隐藏的列或东西。

It definitely depends on the structure of your HTML that is rendered though. There could always be a hidden column or something.

更新：

一个jQuery的解决方案可能是这样的：

A jQuery solution may be something like this:

$(document).ready(function () {
    var rows, genders, ages;

    rows = $("#GridView1").children("tbody").children("tr");    // Find all rows in table (content)
    genders = rows.children("td:nth-child(2)");    // Find all columns that are the 2nd child
    ages = rows.children("td:nth-child(3)");    // Find all columns that are the 3rd child

    // An example of looping through all "gender" columns
    genders.each(function () {
        console.log($(this).html());
    });
});

DEMO： http://jsfiddle.net/YgY35/

这篇关于通过ASP循环：使用JavaScript GridView的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！