[jQuery] Problem With update Ajax POST
Hello i'm new with jQuery and i'm trouble with it:
I'm tryin to do an script like a ranking
I have an mysql table to store the votes.
I want to get no refreshs in my page updating the number of votes and
the ranking position.
the script is running here: http://200.198.106.172/beta
Working for three clicks on the arrows in the third i follow the URL.
The problem appears to be reloading the jquery over and over. But i
don't no how to fix it, or make in other way.
Here is the entire code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jquery test</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function () {
$('.link1').click( function() {
$.ajax({
type: "POST",
url: this.href,
success: function(){
$.ajax({
url: "index.php",
cache: false,
success: function(html){
$("#principal").replaceWith(html);
}
});
}
});
return false;
});
});
</script>
</head>
<body>
<?php
include("db.php");
$query = mysql_query("SELECT * from anuncios ORDER BY contagem DESC");
echo mysql_error();
echo "<div id='principal'>";
while ($anuncio = mysql_fetch_array($query)) {
echo "<div style='border:1px solid'>\n";
echo $anuncio['contagem'] . "\n<br />\n";
echo "<a href=\"processa.php?id={$anuncio[id]}&rank=sobe\" class=
\"link1\"><img src='sobe.gif'></a>\n";
//echo "<a href='#'> <img src='sobe.gif'> </a>";
echo "<a href=\"processa.php?id={$anuncio[id]}\" class=
\"link1\">{$anuncio['texto']}</a>\n";
//echo "<a href=processa.php?id=$anuncio[id] id='link1'>
$anuncio[texto]</a>\n";
echo "<a href=\"processa.php?id={$anuncio[id]}&rank=desce\" class=
\"link1\"><img src='desce.gif'></a>\n";
if ($anuncio['contagem'] < 0) {
echo "<br />editar\n";
}
echo "</div>\n";
echo "<br /><br />";
}
echo "</div>";
?>
</body>
</html>
thanks!