El documento describe un sistema de votación en línea que almacena votos en una base de datos. Al hacer clic en una imagen de un candidato, este recibirá un voto que se sumará a su total almacenado. El sistema utiliza PHP, MySQL y jQuery para mostrar los resultados de las votaciones de manera dinámica sin recargar la página.
1. Project Vote
Lo primero que tenemos que hacer es hacer una base de datos que guarde los votos, al dar
click en el botón de la opción se le sume y cuando no se le de click se le reste, las imagenes
a las que se le daran click tendrán un ID y ponerle un campo como por ejemplo me gusta y
que ese ID tenga un where, aparecerá la imagen de los partidos políticos de la votación, al
dar click en la imagen va a tomar esa votación como seleccionada y será tomada en cuenta
en los resultados, después quedará guardada la votación y se van sumando los votos que
cada candidato obtenga
Estaremos utilizando un que es un sistema para crear encuestas y sistemas de
votaciones simples o múltiples
Advanced Poll es un script en PHP para poder crear encuestas y sistemas de votación para
un sitio web, de dos modos: Puede ser mediante archivos de texto o mediante bases de
datos.
Este sistema contiene características y funciones avanzadas y con una completa interfaz de
administración que te facilitará el trabajo, diseño y configuración de las encuestas que
desees crear para tu sitio web, blog, o portal.
Por último cabe mencionar que es completamente gratis, y contiene varios ejemplos para
que puedas aprender a instalar y utilizar.
REQUERIMIENTOS: Servidor que soporte php y base de datos(SQL)
1.- Para comenzar es necesario acceder a nuestra base de datos y crear las tablas
necesarias para que se ejecute nuestro Script..
CREATE TABLE `votaciones` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`clicks` int(11) NOT NULL DEFAULT '0',
UNIQUE KEY `id` (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci
AUTO_INCREMENT=0 ;
2. Una vez creadas las tablas, procederemos a crear al archivo que contendrá los parámetros
de la encuesta..al igual que los datos de nuestra base de datos
<head><title>Resultados</title></head><center>
<?php
mysql_connect("servidor", "usuario", "contrasena") or die(mysql_error());
mysql_select_db("baseDatos") or die(mysql_error());
$result=mysql_query("select * from votaciones");
?>
<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=1>
<?php
while($row = mysql_fetch_array($result)) {
printf("<tr><td><BR> <font color='green' size='4'><center><b>por la
candidata '%s' se han obtenido:</b> <font color='darkblue'>'%s'</font>
votos</font></center></font></td></TR>",$row["id"],$row["clicks"]);
}
mysql_free_result($result);
?>
</table>
</center>
3. aquí se muestran los resultados con php crea la tabla conecta a la base de datos y
selecciona la tabla de votaciones y el número de votos que obtienen según el id y los clicks
que obtuvo, según como están organizados en el código html es como se van a mostrar
5. <div id="image4" class="contadorClicks"><img src="republicanos.png" width="250"
height="200" />
</div>
<div id="image5" class="contadorClicks"><img src="democratas.png" width="250"
height="200" />
</div>
<center>
</body>
<script src="js/script.js" type="text/javascript"></script>
</html>
bueno este código html carga la libreria de JQuery que es la siguiente:
src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
carga el estilo de las ccs y después los divs con las imágenes correspondientes para
elegir, y pues como ya lo habíamos mencionado cada imagen tiene su propio
identificador y cada una con su estilo el número de los id es igual al de los candidatos
6. pueden ser 4 hasta 100 o asi, todo es dinámicamente y los candidatos generan el
mensaje de cuántos votos, es importante que sea el mismo Identificador que este en la
base de datos para que el contador pueda ser cargado a la base de datos, también
usamos ajax que envía cosas por debajo sin necesidad de estar cargando la pagina
varias veces, le envias los datos el tipo de dato, enviando la url que va a mandar los
datos a la base de datos
Esta imagen muestra que el voto fue sumado al candidato elegido
este codigo php recibe los datos, el id y lo mete en una variable id, después se
incrementa en el contador update se seleccionó el click y se agrega un voto, que es el
id que va a traer ajax
<?php
// Recibimos la ID del vinculo desde la URL
$id = $_REQUEST['id'];
mysql_connect("servidor", "usuario", "contrase� or die(mysql_error());
a")
mysql_select_db("baseDatos") or die(mysql_error());
// Incrementamos en 1 el contador del link con la ID especificada en la url
$update = "UPDATE votaciones SET clicks=(clicks + 1) WHERE id='$id'";
mysql_query($update) or die (mysql_error());
7. ?>
Esta imagen muestra algunas opciones de los partidos para votar y después al dar clic
a alguno sera sumado el voto representado por un check mark
8. Les recomendamos también la librería JavaScript JQuery, interactúa con Ajax y hace
mas fácil trabajar con HTML