Скрипт для голосования своими руками на PHP и MySQL с использованием AJAX

Часто на различных сайтах мы видим блоки с опросом общественного мнения. Как сделать подобный скрипт, для проведения голосования на своем сайте, да еще и таким образом, чтобы при выборе нужного пункта страница не перегружалась целиком, а изменялся только блок с опросом и сразу показывал результаты. Об этом и пойдет речь в данной статье.

Рассмотрим пример.

Скачать пример можно здесь, 3,1 Кб

Пример состоит из 5 различных файлов, рассмотрим каждый из них в отдельности.

Файл dbconnect.php

Служит для соединения с базой данных, для создания необходимой таблицы и для заполнения её примером нашего голосования.

Работа с базами данных описана в статье
«Основные приемы работы с СУБД MySQL, используя язык программирования PHP».

В нашем случае база данных состоит из одной таблицы с тремя полями:
id – идентификатор записи;
title – название записи;
votes – количество голосов, отданных за эту запись.

Первоначально таблица заполняется следующими значениями:

id title votes
1 Куда вы сегодня пойдете NULL
2 Никуда 0
3 В кино 0
4 В клуб 0
5 В магазин 0
6 Другое 0

Запись, для которой поле votes имеет значение NULL – считаем названием опроса, которое содержится в поле title.

Файл showcontent.js

Содержит в себе AJAX-функцию showContent() для обновления контента без перезагрузки страницы. Подробное описание работы данной функции приведено в статье «AJAX и JavaScript. Загрузка контента без перезагрузки страницы".

Файл functions.php

Содержит описание двух функций, применяющихся нами в программе.

Функция drawForm() отображает форму для голосования.

  1. function drawForm() // отображение формы для голосования
  2. {
  3. $r=mysql_query ("SELECT * FROM vote WHERE votes is NULL");
  4. $row=mysql_fetch_array($r);
  5. echo "<p>".$row['title']."</p>";
  6. echo "<form name='vote_form'>";
  7. $r=mysql_query ("SELECT * FROM vote WHERE votes is not NULL");
  8. while ($row=mysql_fetch_array($r))
  9. echo "<input type='radio' name='vote' value='{$row['id']}'> {$row['title']}<br/>";
  10. echo "<br/><input type='button'
  11. onclick='showContent(\"vote.php?select=\"
  12. +getRadioGroupValue(document.vote_form.vote));'
  13. value='Проголосовать'>";
  14. echo "</form>";
  15. }
function drawForm() // отображение формы для голосования
{
	$r=mysql_query ("SELECT * FROM vote WHERE votes is NULL");
	$row=mysql_fetch_array($r);
	echo "<p>".$row['title']."</p>";
	echo "<form name='vote_form'>";
	$r=mysql_query ("SELECT * FROM vote WHERE votes is not NULL");
	while ($row=mysql_fetch_array($r))
		echo "<input type='radio' name='vote' value='{$row['id']}'> {$row['title']}<br/>";
	echo "<br/><input type='button' 
		onclick='showContent(\"vote.php?select=\"
		+getRadioGroupValue(document.vote_form.vote));'
		value='Проголосовать'>";
	echo "</form>";
}

Функция drawResults() отображает результаты голосования.

  1. function drawResults() // отображение результатов
  2. {
  3. $r=mysql_query ("SELECT * FROM vote WHERE votes is NULL");
  4. $row=mysql_fetch_array($r);
  5. echo "<p>".$row['title']."</p>";
  6. $r=mysql_query ("SELECT * FROM vote WHERE votes is not NULL");
  7. while ($row=mysql_fetch_array($r))
  8. echo "{$row['title']}: {$row['votes']}<br/>";
  9. }
function drawResults() // отображение результатов
{
	$r=mysql_query ("SELECT * FROM vote WHERE votes is NULL");
	$row=mysql_fetch_array($r);
	echo "<p>".$row['title']."</p>";
	$r=mysql_query ("SELECT * FROM vote WHERE votes is not NULL");
	while ($row=mysql_fetch_array($r))
	echo "{$row['title']}: {$row['votes']}<br/>";
}

Данные для построения формы и вывода результатов берутся из базы данных.

Файл index.php

Основной файл скрипта голосования. Здесь мы рассмотрим его основную часть. Как мы видим — тело документа состоит из контейнера contentBody.

При загрузке этой страницы мы сперва проверяем, было ли уже произведено голосование. Проверку осуществляем через переменную cookie, поскольку это является наиболее простым случаем. Если голосование произведено не было, то мы выводим в контейнер contentBody форму для голосования. Если же пользователь уже голосовал — выводим результаты поиска.

  1. <body>
  2. <div id="contentBody">
  3. <?php
  4. if ($_COOKIE['codething_vote']=='1') // если уже голосовали, то
  5. drawResults();          // выводим результаты,
  6. else
  7. drawForm();             // иначе форму для голосования
  8. ?>
  9. </div>
  10. <div id="loading" style="display: none">
  11. Идет загрузка...
  12. </div>
  13. </body>
<body>

	<div id="contentBody">
	
		<?php

		if ($_COOKIE['codething_vote']=='1') 	// если уже голосовали, то 
			drawResults();			// выводим результаты,
		else
			drawForm();				// иначе форму для голосования
		?>	
	
	</div>

	<div id="loading" style="display: none">
	Идет загрузка...
	</div>
	
</body>

Файл vote.php

Программный код этого файла выполняется тогда, когда пользователь производит голосование. В этот момент мы создаем переменную cookie, для того, чтобы исключить повторное голосование, сохраняем результат голосования в базу данных и отображаем результаты.

  1. // установка cookie для избежания повторного голосования с одного браузера.
  2. setcookie ("codething_vote","1");
  3. // добавление выбранного варианта
  4. $select = $_REQUEST['select'];
  5. mysql_query ("UPDATE vote SET votes = votes + 1 WHERE id = '$select'");
  6. // отображение результатов
  7. drawResults();
// установка cookie для избежания повторного голосования с одного браузера.
setcookie ("codething_vote","1");
	
// добавление выбранного варианта
$select = $_REQUEST['select'];
mysql_query ("UPDATE vote SET votes = votes + 1 WHERE id = '$select'");

// отображение результатов
drawResults();

Поскольку, выполнение этого файла вызывается через AJAX функцию showContent(), то перезагрузки всей страницы не происходит и результаты выполнения файла помещаются в контейнер contentBody.