Check Out The Latest Themes And Exclusive Deals And Offers On Themes
In Our Deals For Web Developers Section


Join Today And Get All The 87 Themes In Just $69! Join Today

Live Voting System Using Ajax And PHP.

Friday, Mar 3, 2017

Tags:- Ajax jQuery PHP MySQL


Live Voting System is nowadays a common way to get vote on particular thing. In this tutorial we will teach you how to make a simple and best live(without page refresh) voting system using Ajax and PHP.You may also like jQuery live preview.


See Demo
Voting System


To make a Live Voting System Using Ajax and PHP it takes only two steps:-

  1. Make a HTML form to post Vote
  2. Connect to the database and check and insert vote


Step 1.Make a HTML form to Post Vote

We make a HTML form with post method and save it with a name postvote.html

<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
function postvote()
{
var all=document.getElementsByTagName("input");
for(var i=0;i<all.length;i++)
{
 if(all[i].type=="radio" && all[i].checked)
 {
  var vote=all[i].value;
 }
}
    
if(vote)
{
 $.ajax({
 type: 'post',
 url: 'insertvote.php',
 data: {
  vote_val:vote
 },
 success: function (response) {
  $( '#vote_status' ).html(response);
 }
 });
}

else
{
 $( '#vote_status' ).html("Please Select Language");
}

return false;
}

</script>

</head>
<body>
		
<form method="POST" onsubmit="return postvote();">
 <p>Which Is A Best Language?</p>
 PHP <input type="radio" name="yourvote" value="PHP">
 JSP <input type="radio" name="yourvote" value="JSP">
 ASP.Net <input type="radio" name="yourvote" value="ASP.Net">
 <input type="submit" name="submit_form" value="Vote">
</form>
<p id="vote_status"></p>

</body>
</html>

Now our Ajax request on postvote.html sends the voted value to insertvote.php file.



Step 2.Connect to the database and check and insert vote

We create a table named user_vote with two columns user_ip and vote.

CREATE TABLE user_vote(
user_ip VARCHAR(40),
vote TEXT);
// insertvote.php

<?php
$host = 'localhost';
$user = 'root';
$pass = '';
mysql_connect($host, $user, $pass);
mysql_select_db('demo');

if(isset($_POST[ 'vote_val' ]))
{
 $userip=$_SERVER['REMOTE_ADDR']; 

 $checkip=" SELECT user_ip FROM user_vote WHERE user_ip='$userip' ";
 
 $query=mysql_query($checkip);

 if(mysql_num_rows($query)>0)
 {
  echo "You Already Post Your Vote";
 }
 else
 {
  $vote = $_POST[ 'vote_val' ];
  $insertdata=" INSERT INTO user_vote VALUES( '$userip','$vote' ) ";
  mysql_query($insertdata);
  echo "You Vote Is Successfully Inserted";
 }

 exit();
}
?>

We check if the user already post vote or not. If user IP address is already in our database it means that the user already post vote he will get "already vote" message and if the IP address is not in our database then user vote will be inserted.You may also like live character count using jQuery.


That's all, this is how to make a live voting system using Ajax and PHP.You can customize this code further as per your requirement. And please feel free to give comments on this tutorial.

Join Us With Our 21000+ Subscribers And Get Our Latest Tutorials Update Via Email