Система голосования на jQuery, Ajax и PHP

В этом уроке мы будет создавать систему голосования на jQuery, Ajax и PHP.
Система голосования на jQuery, Ajax и PHP

1. Создаем базу
Выполняем sql запрос в phpmyadmin.
Таблица хранения сообщений
CREATE TABLE messages(
mes_id INT PRIMARY KEY AUTO_INCREMENT,
msg TEXT,
up INT,
down INT);

Таблица харнения ip
CREATE TABLE Voting_IP(
ip_id INT PRIMARY KEY AUTO_INCREMENT,
mes_id_fk INT,
ip_add VARCHAR(40),
FOREIGN KEY(mes_id_fk)
REFERENCES messages(mes_id));

2. Создаем Voting.php
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(".vote").click(function() 
{
var id = $(this).attr("id");
var name = $(this).attr("name");
var dataString = 'id='+ id;
var parent = $(this);

if (name=='up')
{
$(this).fadeIn(200).html('<img src="dot.gif" />');
$.ajax({
type: "POST",
url: "up_vote.php",
data: dataString,
cache: false,

success: function(html)
{
parent.html(html);
} 
});
}
else
{
$(this).fadeIn(200).html('<img src="dot.gif" />');
$.ajax({
type: "POST",
url: "down_vote.php",
data: dataString,
cache: false,

success: function(html)
{
parent.html(html);
}
});
}
return false;
});
});
<script

//HTML Code

<?php
include('config.php');
$sql=mysql_query("SELECT * FROM messages LIMIT 9");
while($row=mysql_fetch_array($sql))
{
$msg=$row['msg'];
$mes_id=$row['mes_id'];
$up=$row['up'];
$down=$row['down'];
?>
<div class="main"> 
<div class="box1">
<div class='up'>
<a href="" class="vote" id="<?php echo $mes_id; ?>" name="up">
<?php echo $up; ?></a></div>

<div class='down'>
<a href="" class="vote" id="<?php echo $mes_id; ?>;" name="down">
<?php echo $down; ?></a></div>
</div>

<div class='box2' ><?php echo $msg; ?></div>
</div>

<?php } ?>

3. Создаем up_vote.php
<?php
include background-color:#009900; 
$ip=$_SERVER['REMOTE_ADDR']; 

if($_POST['id'])
{
$id=$_POST['id'];
$id = mysql_escape_String($id);
//Verify IP address in Voting_IP table
$ip_sql=mysql_query("select ip_add from Voting_IP where mes_id_fk='$id' and ip_add='$ip'");
$count=mysql_num_rows($ip_sql);

if($count==0)
{
// Update Vote.
$sql = "update Messages set up=up+1 where mes_id='$id'";
mysql_query( $sql);
// Insert IP address and Message Id in Voting_IP table.
$sql_in = "insert into Voting_IP (mes_id_fk,ip_add) values ('$id','$ip')";
mysql_query( $sql_in);
echo "<script>alert('Thanks for the vote');</script>";
}
else
{
echo "<script>alert('You have already voted');</script>";
}

$result=mysql_query("select up from Messages where mes_id='$id'");
$row=mysql_fetch_array($result);
$up_value=$row['up'];
echo $up_value;

}
?>

4. Создаем down_vote.PHP
Точно такойже код как и в файле up_vote.php просто замените слово вверх на вниз.

CSS код:
#main
{
height:80px; 
border:1px dashed #29ABE2;
margin-bottom:7px;
width:500px;
}
.box1
{
float:left; 
height:80px; 
width:50px;
}
.box2
{
float:left; 
width:440px;
text-align:left;
margin-left:10px;
height:60px;
margin-top:10px;
font-weight:bold;
font-size:18px;
}
.up
{
height:40px; 
font-size:24px; 
text-align:center;
background-color:#009900; 
margin-bottom:2px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
.down
{
height:40px; 
font-size:24px; 
text-align:center; 
background-color:#cc0000;
margin-top:2px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}

Готова.
Теги:
Система голосования
Добавлено: 20 Мая 2018 07:13:13 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...