Jaanus Jaanus - 2 years ago 163
Javascript Question

jQuery cleaning HTML table

This is my table:

<tr class=stuff>
<td id=id></td>
<td id=city_id></td>
<td id=temp></td>
<td id=date></td>
</tr>


This is my Javascript:

<script>
$(document).ready(function() { // waits when document is ready
$('.data').change(function() { // when dropbox value changes do this
getWeather(); // here I tried inserting table clearing code
});
});

function getWeather() {
$.getJSON('getTemperature/' + $('.data option:selected').val(), null, function(data) { // JSON request
$("#id").text(data.id); // changes fields accordingly
$("#city_id").text(data.city_id);
$("#temp").text(data.temperature);
$("#date").text(data.date);
});
}
</script>


Every item in dropdown menu does not have response from server, so I want it to clear the table just before making a new JSON request. So when JSON comes back with data, data is updated accordingly, but when JSON comes back with nothing, then all the tables will be empty.

At the moment when JSON retrieves no data, the old data still remains in the table.

I tried using
$('.stuff').remove()
and
$('.stuff').clean()
, but after using them right before
getWeather();
then later I wasn't able to put info into table which I received from JSON. It just did not work anymore.

Feel free to ask any questions.

Answer Source

Try this

$('.stuff td').text("");
getWeather();
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download