Scusate il titolo ma non sapevo come scrivere!!
Allora....spiego in breve!Mi hanno chiesto su un sito di mettere dei pulsanti MI PIACE come quelli che c'è su Facebook di modo che su ogni notizia scritta le persone possano cliccare se la news piace o meno!!!
Non avendo mai studiato Ajax ho deciso di provare a farlo da me modificando uno script, in ajax, che preveda la compilazione di un form per inviare messsaggi su mail!!!
Il tutto funziona..sono riuscito a fare in modo che cliccando sul pollice (come su facebook insomma) compaia la scritta: " A tot persone piace questo elemento" ,dove il tot aumenta ad ogni click!e il tutto con ajax quindi col risultato in tempo reale.
Il problema però avviene nel momento in cui inserisco un ciclo di FOR che mi ripeta il "mi piace" per 10 volte!! Il primo pulsante funziona..mi fa la somma dei click!!gli altri 9 invece mi ricaricano la pagina!!!
Dunque..vi posto allora i 3 file principili:
index.php
codice:
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Send a mail with php and ajax using jquery</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id="wrap">
<div class="contenitore">
<table>
<tr valign="top">
<td>
<form id="contenutoajax" action="" method ="post">
<input type="image" src="../images/template/scarti/mipiace.jpg" value="send mail" id="sendmail" name="sendmail" width="25" height="25" />
</form></td>
<td><div id="response">
</div></td>
</tr></table>
<script type="text/javascript" src="ajax.js"></script>
</div>
<div class="contenitore">
<table>
<tr valign="top">
<td>
<form id="contenutoajax" action="" method ="post">
<input type="image" src="../images/template/scarti/mipiace.jpg" value="send mail" id="sendmail" name="sendmail" width="25" height="25" />
</form></td>
<td><div id="response">
</div></td>
</tr></table>
<script type="text/javascript" src="ajax.js"></script>
</div>
</div>
</body>
</html>
ajax.js
codice:
$(document).ready(function(){
$("#sendmail").click(function(){
var valid = '';
var isr = 'Obbligatorio inserire';
var name = $("#name").val();
var mail = $("#mail").val();
var subject = $("#subject").val();
var text = $("#text").val();
if (valid!='') {
$("#response").fadeIn("slow");
$("#response").html("ATTENZIONE:
"+valid);
}
else {
var datastr ='name=' + name + '&mail=' + mail + '&subject=' + subject + '&text=' + text;
$("#response").css("display", "block");
$("#response").html("");
$("#response").fadeIn("slow");
setTimeout("send('"+datastr+"')",0);
}
return false;
});
});
function send(datastr){
$.ajax({
type: "POST",
url: "../mipiace/conta.php?conteggio=ok",
data: datastr,
cache: false,
success: function(html){
$("#response").fadeIn("slow");
$("#response").html(html);
setTimeout('$("#response").fadeOut("slow")',2 );
}
});
}
conta.php
codice:
<?php
session_start();
$n=0;
if($_REQUEST['conteggio']==='ok') {
$_SESSION['n']=$_SESSION['n']+1;
$n=$n+1;
echo "A ".$_SESSION['n']." piace questo elemento";
}
?>
spero di essere stato chiaro...e che riusciamo a trovare la soluzione!Grazie mille in anticipo