Hi all. Could really use some help. Have been trying the last 2 days to get the reviews and star ratings to work on the product pages.
So, the issues are as follows:
-
The reviews data is being captured to the “Reviews” database, but the statistics aren’t coming up in the “reviews-stats” database.
-
Product ID isn’t being captured or linked to the review, so there’s not way to filter the reviews by product. I have to add the products on the drop down list on the Reviews database.
-
Submitting a review and then refreshing the page, doesnt show the review or product rating, average etc. However the review does show up on the Reviews database. The Review-Stats database is still unpopulated.
Below is my coding on the product page: Literally copied and edited from
//-------------Imports-------------//
import wixData from ‘wix-data’ ;
import wixWindow from ‘wix-window’ ;
//-------------Global Variables-------------//
// Current product.
let product;
//-------------Page Setup-------------//
$w.onReady( async function () {
// Set the global product variable to the currently displayed product.
product = await $w( ‘#productPage1’ ).getProduct();
// Load the current product’s reviews using the initReviews() function.
initReviews();
});
// Loads the current product’s reviews.
async function initReviews() {
// Filter the “Reviews” dataset to contain only the reviews on the currently displayed product.
await $w( ‘#Reviews’ ).setFilter(wixData.filter().eq( ‘productId’ , product._id));
// Show the reviews after the filter was set and applied on the dataset
showReviews();
// Load the current product’s statistics using the loadStatistics() function.
loadStatistics();
}
// Load the current product’s statistics.
async function loadStatistics() {
// Get the statistics data based on the current product’s ID.
const stats = await wixData.get( ‘review-stats’ , product._id);
// If statistics data for the product was found:
if (stats) {
// Compute the product’s average rating by dividing the total points by the number of ratings.
let avgRating = (Math.round(stats.rating * 10 / stats.count) / 10 );
// Compute the percentage of reviewers that recommend the product.
let percentRecommended = Math.round(stats.recommended / stats.count * 100 );
// Get the ratings element.
let ratings = $w( ‘#generalRatings’ );
// Set the ratings element’s average rating to the value calculated above.
ratings.rating = avgRating;
// Set the ratings element’s number of ratings to the count value from the statistics data.
ratings.numRatings = stats.count;
// Set the text for the recommended percentage element.
$w( ‘#recoPercent’ ).text = ${percentRecommended} % would recommend;
// Show the ratings element.
$w( ‘#generalRatings’ ).show();
// If there is no statistics data for the product:
} else {
// Set the text for the recommended percentage element to reflect the fact that there are no reviews.
$w( ‘#recoPercent’ ).text = ‘There are no reviews yet’ ;
}
// Show the recommended percentage element only after it is populated to avoid flickering.
$w( ‘#recoPercent’ ).show();
}
//-------------Repeater Setup -------------//
// Set up each item in the reivews repeater as it is loaded.
export function reviewsRepeater_itemReady($w, itemData, index) {
// If the reviewer recommends the item:
if (itemData.recommends) {
// Set the "recommend text.
$w( ‘#recommendation’ ).text = ‘I recommend this product.’ ;
// If the reviewer does not recommend the item:
} else {
// Set the “don’t recomend” text.
$w( ‘#recommendation’ ).text = “I don’t recommend this product.” ;
}
// If a photo was uploaded for the review:
if (itemData.photo) {
// Set the image URL from the item data.
$w( ‘#reviewImage’ ).src = itemData.photo;
// Expand the image.
$w( ‘#reviewImage’ ).expand();
}
// Set the ratings element’s rating value.
$w( ‘#oneRating’ ).rating = itemData.rating;
// Get the date that the review was entered.
let date = itemData._createdDate;
// Format the date according to the date format settings on the user’s computer.
$w( ‘#submissionTime’ ).text = date.toLocaleString();
}
//-------------Data Setup -------------//
// Perform some setup when the dataset filter was completed.
export function showReviews() {
// If at least one review has been submitted:
if ($w( ‘#Reviews’ ).getTotalCount() > 0 ) {
// Expand the strip that displays the reviews.
$w( ‘#reviewsStrip’ ).expand();
// If there are no reviews:
} else {
// Collapse the strip that displays the reviews.
$w( ‘#reviewsStrip’ ).collapse(); //otherwise, hide it
}
}
//-------------Event Handlers -------------//
// Set the action that occurs when a user clicks the “Write a Review” button.
export async function addReview_click(event, $w) {
// Create an object containing the current product’s ID to be sent to the review writing lightbox.
const dataForLightbox = {
productId: product._id
};
// Open the “Review Box” lightbox, send it the object created above, and wait for it to close.
let result = await wixWindow.openLightbox( ‘Review Box’ , dataForLightbox);
// After the review lightbox is closed, refresh the reviews dataset so the new review appears on the page.
$w( ‘#Reviews’ ).refresh();
// Reload the current products statistics to reflect the new rating.
loadStatistics();
// Show a thank you message.
$w( ‘#thankYouMessage’ ).show();
}
// Set the action that occurs when a user clicks the “Load More” text.
export function resultsPages_click(event, $w) {
// Load additional reviews into the reviews repeater.
$w( ‘#Reviews’ ).loadMore();
}
