Passage par asp: données GridView à l'aide de javascript

Tout d'abord, il est même possible de faire passer les données dans un asp: GridView à côté du client en utilisant JavaScript. Si oui, j'aimerais savoir comment faire cela …

Comme j'ai l'intention de capturer les valeurs de 2 champs sur la Grille et de joindre une image sur chaque ligne en fonction de leur valeur ( cette partie ne devrait pas poser beaucoup de problème une fois que je peux boucler les données et les comparer ).

My Grid ressemble à quelque chose comme ceci :

<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>

Si je le lance droit: Comment puis-je saisir Gender and Age pour chaque ligne?

PS Je suis également ouvert aux solutions JQuery …….

Comme vous avez l' id de la vue de grille, vous pouvez saisir l'élément en Javascript, itérer à travers ses lignes, puis les cellules des lignes, vérifier l'index 1 (genre) ou 2 (âge) et obtenir son innerHTML pour obtenir le contenu . Regarde ça:

 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/

Cela dépend certainement de la structure de votre HTML qui est rendu. Il pourrait toujours y avoir une colonne cachée ou quelque chose.

METTRE À JOUR:

Une solution jQuery peut être comme ceci:

 $(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/