Mam tabelkę która jest wyświetlana za pomocą AJAX'a
kod HTML tabeli po wyświetleniu przez AJAX:
<div class="col-md-10 col-md-offset-1">
<div class="form-group" id="usun-wszystkie-odebrane-group">
<button type="submit" id="usun-wszystkie-odebrane-button" name="usun-wszystkie-odebrane-button">Usuń Wszystkie Wiadomości</button>
</div>
<div id="wiadomosci-odebrane-alert"></div>
</div>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>#</th>
<th>Nadawca</th>
<th>Tytuł Wiadomości</th>
<th>Data Wysłania</th>
<th>Stan</th>
<th>Odczytaj</th>
<th>Usuń Wiadomość</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>TEST</td>
<td>Jakiś tytuł wiadomości</td>
<td>2015-01-01 21:15:31</td>
<td>przeczytana</td>
<td>
<input type="text" name="id-czytaj-odebrana" value="25">
<button type="submit" id="czytaj-odebrana-button" name="czytaj-odebrana-button">Czytaj</button>
</td>
<td>
<input type="text" name="id-usun-odebrana" value="25">
<button type="submit" id="usun-odebrana-button" name="usun-odebrana-button">Usuń Wiadomość</button>
</td>
</tr>
<tr>
<td>2</td>
<td>TEST2</td>
<td>Jakiś tytuł wiadomości2</td>
<td>2015-01-15 21:15:31</td>
<td>przeczytana</td>
<td>
<input type="text" name="id-czytaj-odebrana" value="30">
<button type="submit" id="czytaj-odebrana-button" name="czytaj-odebrana-button">Czytaj</button>
</td>
<td>
<input type="text" name="id-usun-odebrana" value="30">
<button type="submit" id="usun-odebrana-button" name="usun-odebrana-button">Usuń Wiadomość</button>
</td>
</tr>
</tbody>
</table>
Kod jQuery do wyświetlenia tabeli:
$(function wiadomosci_odebrane_lista() {
$.ajax( {
type: "POST",
url: "lista_odebrane.php",
success: function(data) {
if (data == 0) {
$("#wiadomosci-odebrane-lista").html('<div class="alert-info text-center" role="alert">Brak wiadomości do wyświetlenia!</div>');
setTimeout(wiadomosci_odebrane_lista, 10000);
}
else {
$("#wiadomosci-odebrane-lista").html(data);
$(function usun_wszystkie_wiadomosci_odebrane() {
$("#usun-wszystkie-odebrane-button").unbind().click(function() {
$.ajax( {
type: "POST",
url: "usun_wszystkie_odebrane.php",
success: function(data) {
if (data == 0) {
$("#wiadomosci-odebrane-alert").html('<div class="alert-info text-center" role="alert">Wszystkie wiadomości zostały usunięte!</div>');
setTimeout(wiadomosci_odebrane_lista, 1000);
}
if (data == 1) {
$("#wiadomosci-odebrane-alert").html('<div class="alert-warning text-center" role="alert">Nie jesteś zalogowany!<br />Trwa przenoszenie do Strony Głównej...</div>');
setTimeout(function () {
window.location.href = "index.php";
}, 1000);
}
}
});
});
$(function usun_wiadomosc_odebrana() {
$("#usun-odebrana-button").unbind().click(function() {
var id = $(this).parent('td').children("#id-usun-odebrana").attr("value");
alert(id);
});
});
});
setTimeout(wiadomosci_odebrane_lista, 10000);
}
}
});
}
);
Gdy klikam w przycisk Usuń Wiadomość w pierwszym wierszu tabeli to wyświetla się alert z napisem undefined oraz, natomiast gdy kliknę przycisk Usuń Wiadomość w następnym to nic się nie dzieje.
Funkcja usun_wiadomosc_odebrana pobiera id wiadomości.
Funkcja usun_wszystkie_wiadomości_odebrane usuwa mi wszystkie wiadomości z tabeli za pomocą AJAX'a.
Moje pytanie brzmi w jaki prawidłowy sposób pobrać z inputa typu hidden id wiadomości gdy kliknę w przycisk w tym samym wierszu co ten input a następnie wyświetlić te id w alercie?