Monday, 14 October 2013

Jquery Raty Usage via PHP

JQuery Raty is a best star rating plug-in. it can be used easily with PHP via Jquery Post. This tutorial will show how to do it. Enjoy!

  1. You need to download JQuery Raty from their website. JQury is also required for this plug-in.
  2. Now Create folder name js and put jquery raty minified version inside it and put following link on your page under jquery. Also you have to put all images of stars inside img folder.
    •     <!--For Raty-->
          <script type="text/javascript" src="js/jquery.raty.min.js"></script>
  3. Now you will show stars for any image, just write brlow line under any image. here p1236 is an id for product.
    •  <div id= "p1236 " class= "star "> </div>
  4. Now you will write below code to activate JQuery Raty inside <script type="text/javascript"> </script> tags.
    • $(function() {
      //Below is a path to img folder.
            $.fn.raty.defaults.path = 'js/img';  
      //Below will activate Raty on div where class is star.   
            $('.star').raty({
       half  : true,
              number: 5,
              score : 0,
              click: function(score, evt) {
      //Below will get id value and store in variable pid    
        var pid=$(this).prop('id');
      //Below will post score and id value to raty1.php page behind the scenes. 
            $.post('raty1.php',{score:score, pid:pid},
                          function(data){
                             
                  });
                }
           });
      });
  5. Now on Rat1.php page you can get values of score and id using following code. you can also write mysql query to save these values in database.
    • <?php
      $score = $_POST['score'];
      $pid = $_POST['pid'];
      ?>
Above tutorial is very useful for making websites which require rating function. You can also use some features of this tutorials. For more information please visit Crewow Website