Bootstrap star rating input example
Bootstrap is a free, open-source HTML, CSS, and JS framework containing templates for text, forms, buttons, navigation, datetime and other relevant interface components. Bootstrap has become one of the most popular front-end frameworks and open source projects in the world.
Star rating is often found everywhere. It's a typical rating scale that's getting used by popular marketplace sites. Star rating may be a valuable metric that tells others what most of the people believe a particular product, an app or a movie generally. A star rating comprises of stars with the quantity usually at a maximum of 5. You let your users rate an item using stars. One star means poor, five is superb. By selecting quite one star, all previous stars should be filled.
In the given example, we have included all the necessary css and js libraries and then specified the input field for rating the product. We have also specified the JS code to call the star-rating in the input field.
<!DOCTYPE html> <?php $rating = $_POST['rating']; echo '<h2>Thanks for rating! '.$rating.'</h2>'; ?> <html> <head> <title>Bootstrap star rating example</title> <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-star-rating/4.0.2/css/star-rating.min.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-star-rating/4.0.2/js/star-rating.min.js"></script> </head> <body> <div class="container"> <h2>Bootstrap star rating example</h2> <form action="#" method="post"> <label for="ratinginput" class="control-label">Give rating for the product:</label> <input id="ratinginput" name="rating" class="rating rating-loading" data-min="0" data-max="5" data-step="0.1" value="2"> <input type="submit" name="Submit"/> </form> </div> <script> $("#ratinginput").rating(); </script> </body> </html>
Output of the above code -
How to Retrieve Emails from Gmail using PHP IMAP
How to store Emoji character in MySQL using PHP
How to display PDF file in PHP from database
jQuery loop over JSON result after AJAX Success
PHP Server Side Form Validation
How to add google reCAPTCHA v2 in registration form using PHP
Complete HTML Form Validation in PHP