/    Sign up×
Community /Pin to ProfileBookmark

AJAX: Move elements within a table while reporting back to the server

I have this HTML output from my PHP script:

[code=html]
<table border=”1″ cellpadding=”3″ cellspacing=”1″ width=”100%” style=”text-align: center;”>
<tr>
<td>Time Stamp</td>
<td>Host</td>
<td>IP Address</td>
<td>Username</td>
<td>Password</td>

<td>Action</td>
</tr>
<tr>
<td colspan=”6″ style=”text-align: center;”>Saved</td>
</tr>
<tr>
<td>2000-01-02 00:00:00</td>
<td>website.com</td>
<td>1.1.1.1</td>
<td>MyUser</td>
<td>secretpassword</td>
<td><a href=”/script.php?do=queue&id=53″>Queue</a></td>
</tr>

<tr>
<td>2000-01-01 00:00:00</td>
<td>website.com</td>
<td>1.1.1.1</td>
<td>MyUser</td>
<td>secretpassword</td>
<td><a href=”/script.php?do=queue&id=53″>Queue</a></td>
</tr>
<tr>
<td colspan=”6″ style=”text-align: center;”>Queued</td>
</tr>
<tr>
<td>2000-01-03 00:00:00</td>
<td>website.com</td>
<td>1.1.1.1</td>
<td>MyUser</td>
<td>secretpassword</td>
<td>

<a href=”/script.php?do=save&id=40″>Save</a>
<a href=”/script.php?do=delete&id=40″>Delete</a>
</td>
</tr>
</table>
[/code]

I would like to dynamically update the table using AJAX – instead of refreshing the page as it is now, the rows should “move”, or “disappear”, depending on the action.
Additionally, the updated row location needs to be sorted into the existing rows descending.

Can anyone help me with this?

Here is my PHP file (script.php):

[code=php]
<?php
function connect()
{
global $connection;

$connection = mysql_connect(“localhost”, “username”, “password”);
mysql_select_db(“database”, $connection);
}

function disconnect()
{
global $connection;

mysql_close($connection);
}

if (isset($_REQUEST))
{
if (isset($_REQUEST[‘do’]))
{
if ($_REQUEST[‘do’] == ‘viewlog’)
{
connect();
?>
<table border=”1″ cellpadding=”3″ cellspacing=”1″ width=”100%” style=”text-align: center;”>
<tr>
<td>Time Stamp</td>
<td>Host</td>
<td>IP Address</td>
<td>Username</td>
<td>Password</td>
<td>Action</td>
</tr>
<tr>
<td colspan=”6″ style=”text-align: center;”>Saved</td>
</tr>
<?php
$savedquery = mysql_query(“SELECT * FROM table WHERE saved=1 ORDER BY timestamp DESC “);
while ($row = mysql_fetch_assoc($savedquery))
{
echo “t<tr>n”;
echo “tt<td>” . $row[‘timestamp’] . “</td>n”;
echo “tt<td>” . $row[‘host’] . “</td>n”;
echo “tt<td>” . $row[‘ip’] . “</td>n”;
echo “tt<td>” . $row[‘username’] . “</td>n”;
echo “tt<td>” . $row[‘password’] . “</td>n”;
echo “tt<td><a href=”” . $_SERVER[‘PHP_SELF’] . “?do=queue&id=” . $row[‘id’] . “”>Queue</a></td>n”;
echo “t</tr>n”;
}
?>
<tr>
<td colspan=”6″ style=”text-align: center;”>Queued</td>
</tr>
<?php
$unsavedquery = mysql_query(“SELECT * FROM table WHERE saved=0 ORDER BY timestamp DESC “);
while ($row = mysql_fetch_assoc($unsavedquery))
{
echo “t<tr>n”;
echo “tt<td>” . $row[‘timestamp’] . “</td>n”;
echo “tt<td>” . $row[‘host’] . “</td>n”;
echo “tt<td>” . $row[‘ip’] . “</td>n”;
echo “tt<td>” . $row[‘username’] . “</td>n”;
echo “tt<td>” . $row[‘password’] . “</td>n”;
echo “tt<td>n”;
echo “ttt<a href=”” . $_SERVER[‘PHP_SELF’] . “?do=save&id=” . $row[‘id’] . “”>Save</a>n”;
echo “ttt<a href=”” . $_SERVER[‘PHP_SELF’] . “?do=delete&id=” . $row[‘id’] . “”>Delete</a>n”;
echo “tt</td>n”;
echo “t</tr>n”;
}
?>
</table>
<?php
disconnect();
exit;
}
else if ($_REQUEST[‘do’] == ‘save’ AND $_REQUEST[‘id’] != ”)
{
connect();
mysql_query(“UPDATE table SET saved=’1′ WHERE id=” . $_REQUEST[‘id’] . ” LIMIT 1;”);
disconnect();
header(“Location: ” . $_SERVER[‘PHP_SELF’] . “?do=viewlog”);
}
else if ($_REQUEST[‘do’] == ‘queue’ AND $_REQUEST[‘id’] != ”)
{
connect();
mysql_query(“UPDATE table SET saved=’0′ WHERE id=” . $_REQUEST[‘id’] . ” LIMIT 1;”);
disconnect();
header(“Location: ” . $_SERVER[‘PHP_SELF’] . “?do=viewlog”);
}
else if ($_REQUEST[‘do’] == ‘delete’ AND $_REQUEST[‘id’] != ”)
{
connect();
mysql_query(“DELETE FROM table WHERE id=” . $_REQUEST[‘id’] . ” LIMIT 1;”);
disconnect();
header(“Location: ” . $_SERVER[‘PHP_SELF’] . “?do=viewlog”);
}
}
else if ($_REQUEST[‘ip’] != ”)
{
connect();
mysql_query(“INSERT INTO table
(host, ip, username, password)
VALUES(‘” . addslashes($_REQUEST[‘host’]) . “‘,
‘” . addslashes($_REQUEST[‘ip’]) . “‘,
‘” . addslashes($_REQUEST[‘username’]) . “‘,
‘” . addslashes($_REQUEST[‘password’]) . “‘);”);
disconnect();
exit;
}
}
?>
[/code]

to post a comment
PHP

0Be the first to comment 😎

×

Success!

Help @ayvegh spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.27,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...