2012-04-09 20 views
5

Mam tabeli generowane Entity Framework z wartościami w td, które należy zmienić. Muszę to zrobić w kolejności wiersz po wierszu, ponieważ muszę wstawić grupę przycisków opcji, ale każdy rząd przycisków wymaga unikalnej nazwy.Powtórzenie tabeli znajdowanie td według klasy i zmiana tekstu dla tej td

Zasadniczo muszę ustawić sprawdzoną wartość dla grupy przycisków na podstawie wartości tekstu w td o id "Rate" i usunąć istniejący tekst po otrzymaniu z niego wartości.

Moja tabela wygląda tak,

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

A mój scenariusz jest następujący.

$("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. 
}); 
}); 

To jest właśnie najnowsza, Szukałem po całym tym miejscu, ale wszystko widziałem nie radzić sobie z coraz wartości z określonej kolumny określonego rzędu, zmieniając wartość i powtarzając dla każdego wiersza/kolumny w tabeli. Pochodzę z tła db, gdzie jest to naprawdę proste i jest to bardzo frustrujące.

+0

gdzie zamierzasz umieścić przyciski radiowe? – Patricia

+1

Identyfikator powinien być unikalny w całym DOM. Nie możesz mieć więcej niż jednego "id =" Ocena "' w dokumencie HTML. –

+0

Chcę zamienić tekst w td na ocenę "klasa wskazana" za pomocą przycisków radiowych i sprawdzić ten, który pasuje do wartości. –

Odpowiedz

8

Masz kilka rzeczy nie tak z html i swojej jQuery, na początek, jak stwierdził SKS, nie można mieć wielu węzłów w dokumencie html, które mają ten sam identyfikator ID musi być unikatowe.Zalecam zamiast tego używać klasy ..

Powinieneś również mieć swój wiersz nagłówka w <thead> i ciało stole w <tbody>

teraz, na swojej jQuery, $("td") znajdzie wszystkie td jest w dokumencie, a nie tylko te, które w swoim wierszu.

chcesz użyć $(this).find('td') lub możesz użyć .children lub zaawansowanego selektora wyższego poziomu. Istnieje wiele różnych, poprawnych sposobów uzyskania tych informacji.

Mam biorąc swój kod i modyfikować je tak:

$("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); 

}); 

działa z html nieznacznie zmodyfikowany:

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

nadzieję, że to pomoże Ci idą w dobrym kierunku!

oh, prawie zapomniałem! tutaj jest link do jsfiddle, więc możesz zobaczyć to w akcji: http://jsfiddle.net/fCpc6/

+0

Dzięki Patricia! Zauważyłem, że odpowiedziałeś na podobne pytanie dla Rogera, ale jestem nowy w jQuery i nie mogłem wymyślić, jak go zmodyfikować na mój użytek. –

+0

Moja przyjemność, jquery może być trochę przytłaczająca na początku. Powinieneś poświęcić trochę czasu, szukając dokumentacji dla selektorów. to bardzo ci pomoże. – Patricia

+0

Byłem Patricią, to jest po prostu mylące, ponieważ wszystkie ich przykłady wydają się być pojedynczym przypadkiem, a zastanawianie się, jak je wykorzystać, jest tym, co mnie rzuca. Teraz muszę tylko wymyślić, jak zastąpić wartość w komórce moimi radiami. –

1

myślę szukasz:

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

czyli

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

Masz kilka błędów w javascript.

  • Zastosowanie this dostać td s, które należą do obecnego tr.
  • "text[id=Rating]" jest nieprawidłowym selektorem - nie ma tagu tekstowego.
  • #Rating powinna być prawdopodobnie klasą, ponieważ identyfikatory muszą być unikatowe. .. (Zmiana <td id="Rating"> do <td class="rating">
  • Byłaś brakuje nawiasów na .text()

Oto uaktualniony próbki:

+0

Dzięki, to działa, ale idę z Patricią tylko dlatego, że nie ma pętli tyle. Doceniam to! I dzięki za wskazanie unikalnego problemu z identyfikatorem w HTML! –