JQuery gets the value of a Table column. jquery gets the table

Source: Internet
Author: User

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:

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.