XCalibre1 Posted March 7, 2023 Share Posted March 7, 2023 I have this rating system that I have received and it works fine, and I have been able to write the code for the output of the votes and users, but the actual rating system is not displaying the count. So it's entering the vote into the database but the php is not displaying it, thus didn't know if I should go here or mysqli. but here is the code: Index.php <!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>Review & Rating System in PHP & Mysql using Ajax</title> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> </head> <body> <div class="container"> <h1 class="mt-5 mb-5">Review & Rating System in PHP & Mysql using Ajax</h1> <div class="card"> <div class="card-header">Sample Product</div> <div class="card-body"> <div class="row"> <div class="col-sm-4 text-center"> <h1 class="text-warning mt-4 mb-4"> <b><span id="average_rating">0.0</span> / 5</b> </h1> <div class="mb-3"> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> </div> <h3><span id="total_review">0</span> Review</h3> </div> <div class="col-sm-4"> <p> <div class="progress-label-left"><b>5</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_five_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="five_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>4</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_four_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="four_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>3</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_three_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="three_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>2</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_two_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="two_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>1</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_one_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="one_star_progress"></div> </div> </p> </div> <div class="col-sm-4 text-center"> <h3 class="mt-4 mb-3">Write Review Here</h3> <button type="button" name="add_review" id="add_review" class="btn btn-primary">Review</button> </div> </div> </div> </div> <div class="mt-5" id="review_content"></div> </div> </body> </html> Sumbit rating.php <!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>Review & Rating System in PHP & Mysql using Ajax</title> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> </head> <body> <div class="container"> <h1 class="mt-5 mb-5">Review & Rating System in PHP & Mysql using Ajax</h1> <div class="card"> <div class="card-header">Sample Product</div> <div class="card-body"> <div class="row"> <div class="col-sm-4 text-center"> <h1 class="text-warning mt-4 mb-4"> <b><span id="average_rating">0.0</span> / 5</b> </h1> <div class="mb-3"> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> <i class="fas fa-star star-light mr-1 main_star"></i> </div> <h3><span id="total_review">0</span> Review</h3> </div> <div class="col-sm-4"> <p> <div class="progress-label-left"><b>5</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_five_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="five_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>4</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_four_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="four_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>3</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_three_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="three_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>2</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_two_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="two_star_progress"></div> </div> </p> <p> <div class="progress-label-left"><b>1</b> <i class="fas fa-star text-warning"></i></div> <div class="progress-label-right">(<span id="total_one_star_review">0</span>)</div> <div class="progress"> <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="one_star_progress"></div> </div> </p> </div> <div class="col-sm-4 text-center"> <h3 class="mt-4 mb-3">Write Review Here</h3> <button type="button" name="add_review" id="add_review" class="btn btn-primary">Review</button> </div> </div> </div> </div> <div class="mt-5" id="review_content"></div> </div> </body> </html> Now I have three votes in the database and everything is there. but the 5 star yellow doesn't show the number of votes. As you can see from the screens hot, there are three votes but it doesn't show up on the actual votes. I've spent hours trying to figure out why the votes don't show... it doesn't show the average either. would get greatly appreciated if I could figure this out. Thank you so very much Quote Link to comment Share on other sites More sharing options...
gizmola Posted March 7, 2023 Share Posted March 7, 2023 You provided 2 "php" files, neither of which have any php code in them. I'm going to guess that there are scripts that the UI might call via ajax, to make changes to UI elements, but I don't see references to likely candidates in the html you provided. Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 <?php //submit_rating.php $connect = new PDO("mysql:host=localhost;dbname=images", "root", ""); if(isset($_POST["rating_data"])) { $data = array( ':user_name' => $_POST["user_name"], ':user_rating' => $_POST["rating_data"], ':user_review' => $_POST["user_review"], ':datetime' => time() ); $query = " INSERT INTO review_table (user_name, user_rating, user_review, datetime) VALUES (:user_name, :user_rating, :user_review, :datetime) "; $statement = $connect->prepare($query); $statement->execute($data); echo "Your Review & Rating Successfully Submitted"; } if(isset($_POST["action"])) { $average_rating = 0; $total_review = 0; $five_star_review = 0; $four_star_review = 0; $three_star_review = 0; $two_star_review = 0; $one_star_review = 0; $total_user_rating = 0; $review_content = array(); $query = " SELECT * FROM review_table ORDER BY user_review DESC "; $result = $connect->query($query, PDO::FETCH_ASSOC); foreach($result as $row) { $review_content[] = array( 'user_name' => $row["user_name"], 'user_review' => $row["user_review"], 'rating' => $row["user_rating"], 'datetime' => date('l jS, F Y h:i:s A', $row["datetime"]) ); if($row["user_rating"] == '5') { $five_star_review++; } if($row["user_rating"] == '4') { $four_star_review++; } if($row["user_rating"] == '3') { $three_star_review++; } if($row["user_rating"] == '2') { $two_star_review++; } if($row["user_rating"] == '1') { $one_star_review++; } $total_review++; $total_user_rating = $total_user_rating + $row["user_rating"]; } $average_rating = $total_user_rating / $total_review; $output = array( 'average_rating' => number_format($average_rating, 1), 'total_review' => $total_review, 'five_star_review' => $five_star_review, 'four_star_review' => $four_star_review, 'three_star_review' => $three_star_review, 'two_star_review' => $two_star_review, 'one_star_review' => $one_star_review, 'review_data' => $review_content ); echo json_encode($output); } ?> Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 7, 2023 Share Posted March 7, 2023 As Gizmola says, you show us 2 huge blocks of html code but no 'real' code. How do you expect us to 'fix' the code without seeing any of it? And - we don't really want to see ALL the code. Mostly we like to help those who have made an effort to locate the possible problem area and help them straighten it out if it can be done. PS - do you have php error checking enabled to possible point out something that is not working ? Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 <?php //submit_rating.php $connect = new PDO("mysql:host=localhost;dbname=images", "root", ""); if(isset($_POST["rating_data"])) { $data = array( ':user_name' => $_POST["user_name"], ':user_rating' => $_POST["rating_data"], ':user_review' => $_POST["user_review"], ':datetime' => time() ); $query = " INSERT INTO review_table (user_name, user_rating, user_review, datetime) VALUES (:user_name, :user_rating, :user_review, :datetime) "; $statement = $connect->prepare($query); $statement->execute($data); echo "Your Review & Rating Successfully Submitted"; } if(isset($_POST["action"])) { $average_rating = 0; $total_review = 0; $five_star_review = 0; $four_star_review = 0; $three_star_review = 0; $two_star_review = 0; $one_star_review = 0; $total_user_rating = 0; $review_content = array(); $query = " SELECT * FROM review_table ORDER BY user_review DESC "; $result = $connect->query($query, PDO::FETCH_ASSOC); foreach($result as $row) { $review_content[] = array( 'user_name' => $row["user_name"], 'user_review' => $row["user_review"], 'rating' => $row["user_rating"], 'datetime' => date('l jS, F Y h:i:s A', $row["datetime"]) ); if($row["user_rating"] == '5') { $five_star_review++; } if($row["user_rating"] == '4') { $four_star_review++; } if($row["user_rating"] == '3') { $three_star_review++; } if($row["user_rating"] == '2') { $two_star_review++; } if($row["user_rating"] == '1') { $one_star_review++; } $total_review++; $total_user_rating = $total_user_rating + $row["user_rating"]; } $average_rating = $total_user_rating / $total_review; $output = array( 'average_rating' => number_format($average_rating, 1), 'total_review' => $total_review, 'five_star_review' => $five_star_review, 'four_star_review' => $four_star_review, 'three_star_review' => $three_star_review, 'two_star_review' => $two_star_review, 'one_star_review' => $one_star_review, 'review_data' => $review_content ); echo json_encode($output); } ?> Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 (edited) Sorry I must have uploaded the same file twice.. Slaps self. And sorry, I generally work with php and my out put is in php.. if it's in the wrong place, please move. Sorry. Edited March 7, 2023 by XCalibre1 Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 7, 2023 Share Posted March 7, 2023 Ok - I see that you have the code to display your entire db results with counts by rating as well as an average. Not sure by what you meant in your 1st when you said 'not displaying count'. Other than the display of all of the review data I don't see any other displays so maybe you need to add another echo or something to display whatever var has this count in it? Or you could point out the line(s) where you believe that this count should be getting displayed? Other than that this is some fairly nice code, considering what we normally see here. !! Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 (edited) 6 minutes ago, ginerjm said: Ok - I see that you have the code to display your entire db results with counts by rating as well as an average. Not sure by what you meant in your 1st when you said 'not displaying count'. Other than the display of all of the review data I don't see any other displays so maybe you need to add another echo or something to display whatever var has this count in it? Or you could point out the line(s) where you believe that this count should be getting displayed? Other than that this is some fairly nice code, considering what we normally see here. !! see all the ratings? You have all the stars listed ad 5,4,3,2,1... but on the right they are all 0.... it should shows how many votes someone has voted. Like if someone voted a 4 star, then the top should show the four start listed as 1 vote, and the average should show on the left. So in my original example I have 3 votes... a 1 star and 2 three stars... it should show that on top that a 1 should s how in the 1 star category and then a 2 should show in the 3 star category.... it puts it all in the database, but doesn't show it all. and then should show the average on left. Edited March 7, 2023 by XCalibre1 Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 7, 2023 Share Posted March 7, 2023 (edited) Images are one thing, but you are looking for code help. Where is that code? Although if it is JS, perhaps you need to post that in a JS forum unless it is something that PHP people can handle. I'm one of those that gets by with JS but not when it gets huge. I'm assuming that that output is being generated from the JSON data you built at the end of the php code. Edited March 7, 2023 by ginerjm Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 2 minutes ago, ginerjm said: Images are one thing, but you are looking for code help. Where is that code? Although if it is JS, perhaps you need to post that in a JS forum unless it is something that PHP people can handle. I'm one of those that gets by with JS but not when it gets huge. I'm assuming that that output is being generated from the JSON data you built at the end of the php code. Yes, but nothing shows lol.. been on this for hours. banhead... again sorry if it's in wrong spot. Quote Link to comment Share on other sites More sharing options...
kicken Posted March 7, 2023 Share Posted March 7, 2023 So far you've posted The HTML code for your UI layout, but without any of the data (just placeholder values) PHP code that outputs some JSON data to something. Presumably there is a third bit of code somewhere (likely Javascript) that takes that JSON output from the PHP and populates your UI with that data. If that third bit of code exists, then you need to post it for anyone to determine why it's not populating the UI (along with an errors you might see in your browser's developer console). If that third bit of code does not exist, then you either need to create it, or change your PHP code to output the value directly into your HTML rather than as JSON data. 1 Quote Link to comment Share on other sites More sharing options...
XCalibre1 Posted March 7, 2023 Author Share Posted March 7, 2023 I dn't have a 3rd piece of code. I took what someone else did and wrote code myself in much of it, but nothing there that sends the json output to the index to show the information.. I only know mainly php, so that's why I came asking for help. Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 8, 2023 Share Posted March 8, 2023 Well it isnt in the php code so it has to be something that is being called somewhere and that is probably in one of the included JS files. What does your html body tag look like? Quote Link to comment Share on other sites More sharing options...
Solution gizmola Posted March 8, 2023 Solution Share Posted March 8, 2023 So what people are trying to say is that something must run the submit_rating.php when a review is posted. The same script needs to be run when a page is loaded, as it returns the data you need for your page to update the numbers you want to see updated in a json structure. We can surmise that the way to do the ajax calls is with jquery, since jquery was included in the html you provided. Here is the jquery documentation. Read through that and try and adapt their examples. Just to simplify things for you you can focus on the $.ajax() method, as the other methods are just HTTP request type wrappers around $.ajax. The html page you provided needs some jquery code to: define the handler code you need that will submit the form data to submit_rating.php bind that handler to the submit button of the form define a function that takes the json results returned from submit_rating.php (which are the actual stored ratings) and using those to update the various places in the Dom where the relevant numbers are required. Doing that can also be done with jquery, which has various methods to select and then manipulate DOM elements. Currently there is no code to do these things, that you have presented. If you need to write that code yourself, then you now have a basic step by step guide as to what you need to do. It's also a pretty standard way of doing things, although jquery has fallen out of favor in recent years as javascript frameworks like vue and react have become popular. Neither of those frameworks are relevant to your code though. I will mention in closing, that it would be very helpful for you to understand submit_rating and it's dual purpose. That script is designed both to update the statistics if the review form was submitted, and to also get the statistics, and those 2 functions are not mutually exclusive. You must understand how to construct a POST structure in your function that is meant to handle a form submission, by getting the input from the field(s) needed and passing that in the post. Make sure you understand how to get that code to be triggered when the form is submitted, and not triggered when it's not needed (ie when it's just a GET request to load the page). Hope this helps you move forward. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.