JQuery gets the value of a Table column. jquery gets the table
When I wrote this blog post, I found that I had previously written the http://www.cnblogs.com/insus/p/5434062.html "getting a able to select a column value for the first row.
But it is totally different from what I mentioned in this article. This Insus. NET requires jQuery to obtain data in a column in a row of an html table.
See the following table:
Html code:
<Table> <tr> <th style = "width: 10px; "> <input id =" SelectAll "type =" checkbox "/> </th> <th> ID </th> <th> billing item </th> <th> fee description </th> <th> billing details </th> <th> currency </th> <th style = "width: 50px; "> operation </th> </tr> @ foreach (var m in new HighwayAdditionalChargeEntity (). highwayAdditionalCharges () {<tr class = "trData"> <td> <input id = "" class = "SelectSingle" type = "checkbox" value = "@ m. highwayAdditionalCharge_nbr "/> </td> <td> @ m. highwayAdditionalCharge_nbr </td> <td> @ m. item </td> <td> @ m. description </td> <td> @ m. itemizations </td> <td> @ m. currency </td> <input class = "Select" id = "ButtonSelect" type = "button" value = "Select"/> </td> </tr>} </table>Source Code
When you click the "select" button in the last column of a row, you want to obtain data in a column of this row.
Insus. NET shows the columns and indexes in the graph. The index starts from 0. To obtain the value of the "billing name" column, the column index of this column is 2.
Demo:
The above value is obtained using the. text () method. But at a certain time, you want to get the value of the column. The value is the HTML code, so we can use the .html () method. The following Insus. NET is slightly modified:
Demo:
Actually, using indexes to obtain values is only one method, but it is not the best choice for Insus. NET. Because data rows are dynamically rendered, columns may also change. Therefore, Insus. NET is still used to style class implementation:
To obtain the value of the "fee explanation" column, add a class in this column:
JQuery code:
Demo: