Question

This is for a server status page using php and jquery. The page can be described as a table of appservers and webservers with empty cells where the status will appear on a button click. When clicking the button many instances of a servercheck.php script will be fired off asynchronously (the reason for using jquery instead of synchronous PHP-only) and the results are returned to the correct cell in the table according to the id of the td element.

All of which is kinda irrelevant other than background info.

So when the page first loads, a cell like this is waiting to be populated:

    <td id="a101-w01">&nbsp</td>

So I have a working .load() and example of which would be:

$("#a101-w01").load(\"singleServerCheck.php?&appserver=appservera&webserver=webserver1");

which would return something like:

<td id="a101-w01" class="up">Server UP</td>

I cant just use (“#a101-w01”).load() because that only replaces the contents of the element, not the element itself (thus creating a cell inside the already existing cell instead)

What I want is this

<td id="a101-w01">&nbsp</td>

to be replaced with this

<td id="a101-w01" class="green">SERVER UP</td>

Urgh that was kinda hard to explain 🙂 Anyway I have tried something like this:

$("#a101-w01").replaceWith().load(\"singleServerCheck.php?&appserver=appservera&webserver=webserver1");

and

$("#a101-w01").replaceWith(.load(\"singleServerCheck.php?&appserver=appservera&webserver=webserver1"));

but they are not right … Can someone help this n00b to bring the two functions together?? 🙂

Answer 1

Replacing td is not correct. I see what you are trying to do which is very simple. Try something like this.

Return just a string "SERVER UP" or "SERVER DOWN" from the server side and using that change add the required text and class

$.get("singleServerCheck.php?&appserver=appservera&webserver=webserver1", function(data){
     $('#a101-w01').html(data).addClass(data == "SERVER UP" ? "green" : "red");
});