sql >> Databáze >  >> RDS >> Mysql

Kurz hodnocení hvězdičkami Jquery pomocí php a mysql

Toto je velmi jednoduchý a rychlý návod, jak velmi snadno vytvořit hodnocení hvězdičkami pomocí jquery A návštěvníci obchodu hlasují v databázi pro zobrazení popularity produktu. Toto je ukázkový skript, zde jsem nepoužil příliš dobré uživatelské rozhraní, soustředím se jen na vytváření dynamických funkce hodnocení hvězdičkami pomocí PHP a Mysql.

Vytvořil jsem ukázkovou databázi, kde se budou ukládat hlasy návštěvníků, a pomocí těchto hlasů zobrazím průměrné hodnocení produktu, skript vytvořený v Core PHP a Mysql, takže se můžete snadno integrovat do svého webového projektu.




Ukázka struktury tabulky hodnocení.

CREATE TABLE IF NOT EXISTS `rating` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `product_id` int(11) NOT NULL,
  `vote` float NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1

V tomto tutoriálu jsem použil plugin pro hodnocení hvězdičkami jquery k zobrazení hodnocení hvězdičkami jako část uživatelského rozhraní, můžete prozkoumat další funkce hodnocení uživatelského rozhraní pomocí tohoto oficiálního pluginu hodnocení. Podporuje také funkci odezvy na bootstrap.
http://www.jqueryrain.com/?d8VUtmAN

Vytvořte ukázkový soubor uživatelského rozhraní s některými ukázkovými produkty a jejich hodnocením.

 <table border=1>
 <tr><td >
    <img src="img/p1.jpeg">
    <h3>Product-1</h3> 
   <input value="0" type="number" class="rating" min=0 max=5 step=0.1 data-size="md" data-stars="5" productId=1>
        </td>
   <td> 
   <img src="img/p2.jpeg"> 
     <h3>Product-2</h3> 
    <input value="0" type="number" class="rating" min=0 max=5 step=0.1 data-size="md" data-stars="5" productId=2>
    </td>
    </tr></table>

Poté zahrňte požadované knihovny hodnocení (css &js).

 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet">
<link href="css/star-rating.min.css" media="all" rel="stylesheet" type="text/css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="js/star-rating.min.js" type="text/javascript"></script>

Aplikujte kód jquery vždy, když uživatel udělí hodnocení produktu, pak jeden požadavek ajax odejde na server s productId a daným hlasem a tyto hodnoty musíte uložit do své databáze.

<script type="text/javascript">
        $(function(){
               $('.rating').on('rating.change', function(event, value, caption) {
                productId = $(this).attr('productId');
                $.ajax({
                  url: "rating.php",
                  dataType: "json",
                  data: {vote:value, productId:productId, type:'save'},
                  success: function( data ) {
                     alert("rating saved");
                  },
              error: function(e) {
                // Handle error here
                console.log(e);
              },
              timeout: 30000  
            });
              });
        });
    </script>

Vytvořte soubor serveru rating.php , kam zapíšete funkci ukládání a načítání hodnocení.

<?php
function connect() {
$hostname = "localhost";
$username = "root";
$password = "root";
$dbname = "test";
  $con = mysqli_connect($hostname, $username, $password, $dbname);	
  return $con;
}
 
function getRatingByProductId($con, $productId) {
	$query = "SELECT SUM(vote) as vote, COUNT(vote) as count from rating WHERE product_id = $productId";
 
      $result = mysqli_query($con, $query);
      $resultSet = mysqli_fetch_assoc($result);
      if($resultSet['count']>0) {
      	$data['avg'] = $resultSet['vote']/$resultSet['count'];
      	$data['totalvote'] = $resultSet['count'];
      } else {
      	$data['avg'] = 0;
      	$data['totalvote'] = $resultSet['count'];
      }
      return $data;
 
}
if(isset($_REQUEST['type'])) {
	if($_REQUEST['type'] == 'save') {
		$vote = $_REQUEST['vote'];
		$productId = $_REQUEST['productId'];
	      $query = "INSERT INTO rating (product_id, vote) VALUES ('$productId', '$vote')";
	      // get connection
	      $con = connect();
	      $result = mysqli_query($con, $query);
	      echo 1; exit;
	} 
}
 
?>



Podívejte se na živé demo a stáhněte si zdrojový kód.

DEMO

STÁHNOUT

Doufám, že tento tutoriál vám pomůže vytvořit systém hodnocení pro vaše webové projekty.

Pokud se vám tento příspěvek líbí, nezapomeňte se přihlásit k odběru mého veřejného zápisníku pro další užitečné věci


  1. SCD typ 6

  2. Jak zálohovat databázi Chamilo LMS MySQL

  3. Jak vytvořit alias pole nebo sloupce v MySQL?

  4. Dokážete VYBRAT všechno, kromě 1 nebo 2 polí, bez spisovatelské křeče?