Geek Answers Handbook

Iterate through the table, find td by class, and change the text for that td

I have an Entity Framework table created with the values ​​in td that I need to change. I need to do this sequentially because I need to insert a group of radio buttons, but each row of buttons needs a unique name.

Basically, I need to set the checked value for the button group based on the text value in td with the identifier "Rate" and delete the existing text after I got the value from it.

My table looks like this:

<table id="IndexTable">
<tr>
    <th>CoffeeID </th>
    <th>Degree </th>
    <th>Weight </th>
    <th>Profile </th>
    <th>UsageInfo </th>
    <th>Comments </th>
    <th>AmbientTemp </th>
    <th>Rating </th>
    <th>WeightDeducted </th>
    <th>Selected </th>
    <th>ProfileID </th>
    <th>ProfileStart </th>
</tr>
<tr>
    <td>1 </td>
    <td>1 </td>
    <td>3 </td>
    <td>9 </td>
    <td>Filter Brew </td>
    <td>Perfecto!! </td>
    <td>55 </td>
    <td id="Rating">4.25 </td>
    <td>1 </td>
    <td>4 </td>
    <td>34 </td>
    <td>1 </td>

</tr>
<tr>
    <td>3 </td>
    <td>15 </td>
    <td>99 </td>
    <td>87 </td>
    <td>Espresso </td>
    <td>WTF </td>
    <td>99 </td>
    <td id="Rating">4.5 </td>
    <td>5 </td>
    <td>3 </td>
    <td>66 </td>
    <td>4 </td>

</tr>

And my script is as follows.

$("tr").each(function() { //get all rows in table
var str = $("text[id=Rating]").val(); //assign text with matching id to str ---doesn't work
$("td").each(function() { //get all tds in current row
    var newStr = ("#Rating").text; //assign text in td with id Rating to newStr ---- doesn't work
    alert(newStr); // fires undefined for each td in table? 
    //This is where I want to insert radio buttons and assign the one with the value of the Rating td to checked.
});
});

, , , , , / . db, , .

+5
3

- html jQuery, , SKS, html-, ID. . .

<thead> <tbody>

, jQuery, $("td") td , , .

$(this).find('td'), .children . , .

:

$("tbody").find("tr").each(function() { //get all rows in table

    var ratingTdText = $(this).find('td.Rating').text(); 
    //gets the text out of the rating td for this row
    alert(ratingTdText);

});

html:

<table id="IndexTable">
<thead>
    <tr>
    <th>CoffeeID </th>
    <th>Degree </th>
    <th>Weight </th>
    <th>Profile </th>
    <th>UsageInfo </th>
    <th>Comments </th>
    <th>AmbientTemp </th>
    <th>Rating </th>
    <th>WeightDeducted </th>
    <th>Selected </th>
    <th>ProfileID </th>
    <th>ProfileStart </th>
</tr>
</thead>
<tbody>
<tr>
    <td>1 </td>
    <td>1 </td>
    <td>3 </td>
    <td>9 </td>
    <td>Filter Brew </td>
    <td>Perfecto!! </td>
    <td>55 </td>
    <td class="Rating">4.25 </td>
    <td>1 </td>
    <td>4 </td>
    <td>34 </td>
    <td>1 </td>

</tr>
<tr>
    <td>3 </td>
    <td>15 </td>
    <td>99 </td>
    <td>87 </td>
    <td>Espresso </td>
    <td>WTF </td>
    <td>99 </td>
    <td class="Rating">4.5 </td>
    <td>5 </td>
    <td>3 </td>
    <td>66 </td>
    <td>4 </td>

</tr>
</tbody>
</table>

, !

, ! jsfiddle, : http://jsfiddle.net/fCpc6/

+8

, :

var newStr = ("#Rating").text();

:

var newStr = ("td[id='Rating']").text();
+1

javascript.

  • this, td, tr.
  • "text[id=Rating]" - - .
  • #Rating , , , . ( <td id="Rating"> <td class="rating">.
  • .text().

:

$("tr").each(function() { //get all rows in table
  $("td", this).each(function() { //get all tds in current row
    var newStr = $(".rating").text(); //assign text in td with id Rating to newStr ---- doesn't work
    alert(newStr); // fires undefined for each td in table? 
    //This is where I want to insert radio buttons and assign the one with the value of the Rating td to checked.
  });
});
0

More articles:


All Articles