Agence 84 – Technologies Web & Mobile en Algérie

menu agence84

Blog Agence84

Vote dynamique en Ajax sous jQuery/PHP

Comment avoir un systeme de vote Ajax sur son site?
c’est simple avec Dynamic Poll jQuery/PHP , il suffit de suivre le tutorial suivant.

Ce script permet aux internautes de voter sans que la page ne soit rafraichie et en plus il bloque les multiples votes en enregistrant l’IP du votant.

Par défaut, ce script utilise deux fichiers TXT un pour les résultats de vote et l’autre pour les IP mais vous pouvez modifier le script pour qu’il enregistre dans une base de données.

Guide d’installation :

Télécharger le package qui contient une démo :

Avant la fin de la balise insérer le code ci-dessous

<link href= »style.css » rel= »stylesheet » type= »text/css » />
<script src= »jquery.js » type= »text/javascript » charset= »utf-8″></script>
<script src= »jquery.cookie.js » type= »text/javascript » charset= »utf-8″></script>
<script src= »poll.js » type= »text/javascript » charset= »utf-8″></script>

à l’intérieur de la balise body :

<div id= »poll-container »>
<h3>Poll</h3>
<form id=’poll’ action= »poll.php » method= »post » accept-charset= »utf-8″>
<p>Pick your favorite Javascript framework:</p>
<p><input type= »radio » name= »poll » value= »opt1″ id= »opt1″ /><label for=’opt1′>jQuery</label><br />
<input type= »radio » name= »poll » value= »opt2″ id= »opt2″ /><label for=’opt2′>Ext JS</label><br />
<input type= »radio » name= »poll » value= »opt3″ id= »opt3″ /><label for=’opt3′>Dojo</label><br />
<input type= »radio » name= »poll » value= »opt4″ id= »opt4″ /><label for=’opt4′>&rototype</label><br />
<input type= »radio » name= »poll » value= »opt5″ id= »opt5″ /><label for=’opt5′>YUI</label><br />
<input type= »radio » name= »poll » value= »opt6″ id= »opt6″ /><label for=’opt6′>mootools</label><br /><br />
<input type= »submit » value= »Vote » /></p>
</form>
</div>

il faut ouvrir le fichier poll.php et modifer les paramètres suivants :
Insérer la liste des options du vote dans le tableau $options[]

$options[1] = ‘jQuery’;
$options[2] = ‘Ext JS’;
$options[3] = ‘Dojo’;
$options[4] = ‘Prototype’;
$options[5] = ‘YUI’;
$options[6] = ‘mootools’;

Mettre le nom du fichier vote :

define(‘HTML_FILE’, ‘index.html’);

Mettre le dossier des fichiers résultat de vote et ip :

$db->datadir = ‘data/’;
define(‘VOTE_DB’, ‘votes.txt’);
define(‘IP_DB’, ‘ips.txt’);

Pour avoir une liste plus détaillé de tous les paramètres et fonctions il faut aller sur l’excellent NetTuts

Démo