VPF::Голосование без перезагрузки страницы

Nick888

Дата 16.12.2014, 20:56 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 5
Регистрация: 11.11.2014

Репутация: нет
Всего: -1

Имеется скрипт для голосования на PHP (+ БД MySQL), посмотреть результаты можно без перезагрузки страницы.

Есть 2 таблицы: polls (с вопросами) и poll_answer (с ответами).
Скрипт для создания этих самых таблиц:

Код


CREATE TABLE IF NOT EXISTS `polls` (
`id` int(10) unsigned NOT NULL auto_increment, `title` varchar(255) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=1;

Код


CREATE TABLE IF NOT EXISTS `poll_answer` (
`id` int(10) unsigned NOT NULL auto_increment, `poll_id` int(10) unsigned NOT NULL,
`title` varchar(255) NOT NULL, `votes` int(10) unsigned NOT NULL default '0',
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=1;

Далее создаём 2 файла. Первый отвечает за отображение опросов. Его скрипт приведён ниже.

Код


<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<?php
$db=mysqli_connect("localhost","root","","vote");
$res=mysqli_query($db,"set names utf8"); 

$res=mysqli_fetch_array(mysqli_query($db,"SELECT max(id) FROM polls LIMIT 1")); 
$poll_id=$res[0];
$max_id=$res[0];

if (isset($_GET["poll_id"]) and is_numeric($_GET["poll_id"]) and $_GET["poll_id"]>0){
$res=mysqli_fetch_array(mysqli_query($db,"SELECT id FROM polls
WHERE id='".$_GET["poll_id"]."' LIMIT 1"));
if ($res[0]!='') $poll_id=$res[0];
}
$poll=mysqli_fetch_array(mysqli_query($db,"SELECT id,title FROM polls
WHERE id='".$poll_id."'"));
?>

<style type="text/css">
.polls{padding:10px; text-align:center; border:1px solid #EEEEEE; width:1050px;}
.poll{text-align:left; display:table; width:100%; font-size:14px;}
.poll label{line-height:2;}
.votes{text-align:center; background-color:#00FF00; border:1px solid #0033FF; 
margin:0 0 10px 0;}
</style>

<?php
echo '<div class="polls"><b>'.$poll["title"].'?</b>';
echo '<div class="poll" id="poll_'.$poll_id.'">';
$res=mysqli_query($db,"SELECT id,title FROM poll_answer
WHERE poll_id='".$poll_id."' ORDER BY id");
while ($answer=mysqli_fetch_array($res)) echo '<label><input type="radio"
name="item" value="'.$answer["id"].'">'.$answer["title"].'</label><br>';
echo '<div align="center"><input type="submit" id="view_res"
value="Посмотреть результат">';
echo '<input type="submit" id="vote" value="Голосовать">';
echo '</div></div></div><br>';
?>

<script type="text/javascript">

$(document).ready(function(){
$(".poll input:first").prop("checked",true);

$("#vote").click(function(){
jQuery.post("polls_result.php",{poll_id:$(this).parents(".poll").attr("id").
split('_')[1], answer_id:$('input:checked').val()},rating_poll);});

$("#view_res").click(function(){
jQuery.post("polls_result.php",{poll_id:$(this).parents(".poll").attr("id").
split('_')[1]},rating_poll);});

function rating_poll(data){
$(".poll").fadeOut(500, function(){$(this).html(data).fadeIn(500);});

}
});
</script>

Второй файл и его код ниже.

Код


<?php
if (isset($_POST["poll_id"]) and is_numeric($_POST["poll_id"])) {
$poll_id=$_POST["poll_id"];
}
else $poll_id='';
if (isset($_POST["answer_id"]) and is_numeric($_POST["answer_id"])) {
$answer_id=$_POST["answer_id"];
}
else $answer_id='';

if ($poll_id>0) {
$db=mysqli_connect("localhost","root","","vote"); 
$res=mysqli_query($db,"set names utf8");

if ($answer_id!='') {
$res=mysqli_query($db,"UPDATE poll_answer SET votes=(votes+1)
WHERE id='".$answer_id."' LIMIT 1");
$answer='Ваш голос учтён!';
}

$summa=mysqli_fetch_array(mysqli_query($db,"SELECT max(votes) AS max_v, sum(votes)
AS sum_v FROM poll_answer WHERE poll_id='".$poll_id."' LIMIT 1"));
if ($summa["max_v"]==0) $summa["max_v"]=$summa["sum_v"]=1;
$res=mysqli_query($db,"SELECT title,votes FROM poll_answer 
WHERE poll_id='".$poll_id."' ORDER BY votes DESC");

while ($rating=mysqli_fetch_array($res)) {
echo '<div style="width:560px; float:left;">'.$rating["title"]; //устанавливаем ширину линии 560px
echo '<div class="votes" style="width:'.($rating["votes"]/$summa["max_v"]*560); // соотношение с другими линиями (ширина)
echo 'px;">'.$rating["votes"].'</div></div><div style="float:right;"><br>';
echo round(100*$rating["votes"]/$summa["sum_v"],2).' %</div>'; //процентное соотношение ответов 
}
echo '<div style="width:100%;float:left;">Голосов: <b>'.$summa["sum_v"].'</b>';

}
?>

При нажатии на "Посмотреть результат" или на "Голосовать" элементы-переключатели (радио-кнопки) "пропадают"/"исчезают", также как и сами кнопки "Посмотреть результат" и "Голосовать". Как сделать так, чтобы они оставались на прежнем месте, а сам вывод результатов ответов был расположен в нижней части окна?

Это сообщение отредактировал(а) Nick888 - 17.12.2014, 21:49

Aliance

Дата 17.12.2014, 08:55 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 3
Всего: 137

Изменить это поведение в функции rating_poll. Например так:

Код


function rating_poll(data){
    $(document).append('<div>' + data + '</div>');
}

Лучше конечно заранее завести блок и аппендить туда, мой код приведен для примера.

ПС:

Цитата

$res=mysqli_fetch_array(mysqli_query($db,"SELECT max(id) FROM polls LIMIT 1"));
$poll_id=$res[0];
$max_id=$res[0];

Атомарность? Не, не слышал.

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Nick888

Дата 19.12.2014, 20:35 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 5
Регистрация: 11.11.2014

Репутация: нет
Всего: -1

Ну или такой вариант:

Код


function rating_poll(data){ 
$(".result_request").fadeOut( 500, function(){ $(this).html(data).fadeIn(500); }); 
}

А как сделать так, чтобы при нажатии на кнопки "Посмотреть результат" или на "Голосовать" результаты ответов выводились С ПЕРЕЗАГРУЗКОЙ СТРАНИЦЫ, а не без неё, как в этом скрипте?

Это сообщение отредактировал(а) Nick888 - 19.12.2014, 20:35

Aliance

Дата 22.12.2014, 08:37 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 3
Всего: 137

Цитата(Nick888 @ 19.12.2014, 21:35

)

Обернуть все свои <input> в <form> и убрать с них обработчики событий лишние.

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Nick888

Дата 24.12.2014, 21:24 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 5
Регистрация: 11.11.2014

Репутация: нет
Всего: -1

А если в самой концовке первого скрипта добавить строки ниже, то тогда же должно обновляться с перезагрузкой?

Код


function rating_poll(data){ 
window.location.reload();
}

Aliance

Дата 25.12.2014, 16:41 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 3
Всего: 137

Да, но а какой в этом смысл? Вы используете технологию ajax (отправка данных без перезагрузки страницы), чтобы потом перезагрузить страницу? Rly?

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Nick888

Дата 25.12.2014, 20:36 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 5
Регистрация: 11.11.2014

Репутация: нет
Всего: -1

но почему-то не робит это...

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| PHP: Базы Данных \| Следующая тема »