Ajax-PHP Rating Stars-SyntaxError JSON.parse unexpected character

Place for comments, problems, questions, or any issue related to the JavaScript / PHP scripts from this site.
User avatar
waleedbarakat
Posts: 7
Location: Cairo, Egypt

Ajax-PHP Rating Stars-SyntaxError JSON.parse unexpected character

The Ajax-PHP Rating Stars Script, I am trying to get it working but I keep getting this error:

Code: Select all

SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON dataratings.js:136:30
    onreadystatechange http://localhost/test/ratingfiles/ratings.js:136
line 136 says:

Code: Select all

let jsonitems = JSON.parse(obajx.responseText);
Hope someone can tell me what is going wrong?
Thank you for your help.

Admin
Hello,
If the script is not put directly in the Root folder of your website, you must add the correct path for the ratings.php file in the ratings.js file (Line 127).
- Put the absolute path (the address with http ), for example:

Code: Select all

obajx.open('post', 'http://localhost/test/ratingfiles/ratings.php', true);
Or delete the starting slash.

Code: Select all

obajx.open('post', 'ratingfiles/ratings.php', true);
- Read section 5 from "Other settings" in the readme.html file.

waleedbarakat
I already did that and much more, but the same issue still persists, I have also disabled other jQuery files and js files and still see the issue! What is going wrong?

Still see this:

Code: Select all

SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
onreadystatechange localhost/test/ratingfiles/ratings.js:136 => let jsonitems = JSON.parse(obajx.responseText);
And when I tried it on Chrome I get this:

Code: Select all

Uncaught SyntaxError: Unexpected token S in JSON at position 0
    at JSON.parse (<anonymous>)
    at XMLHttpRequest.obajx.onreadystatechange

Admin
I just tested the script on localhost and it works.
From the error message you posted it seems it is something from php, maybe you edited something wrong in the ratings.php file.
To can fix it we need to see what response is received from php.
Add the following code in the ratings.js file (between the lines 134 and 135):

Code: Select all

alert(obajx.responseText);
In the ratings.js file you must have:

Code: Select all

if (obajx.readyState == 4) {
  alert(obajx.responseText);  //For Debug
  // receives a JSON with one or more item:['totalrate', 'nrrates', renot]
  let jsonitems = JSON.parse(obajx.responseText);

  //The rest of code ...
Then post here the content that will be displayed in the alert box.

waleedbarakat
Awesome, Finally I get it works, after adding this line

Code: Select all

alert(obajx.responseText);
it guided me to what was missing, first of all, the files URL's isn't correct, then the DB tables were missing, and finally, it works :)

Actually, I found tons of other scripts but no one can be that easy to set up with powerful features like yours, Also, I have tried the voting script (thumbs up and down) but I stuck in getting the actually rating stats like the star rating script does.

I wanted to fill these values for Google rich snippets:

Code: Select all

<div class="rating" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
 <meta itemprop="bestRating" content="5" />
 <meta itemprop="worstRating" content="1" />
 <meta itemprop="ratingValue" content="{$votes}" />
 <meta itemprop="ratingCount" content="{$nvotes}" />
</div>
The thumbs up script won't give these values as it appends endless numbers!

I am already using a star rating script (but it's too old and not working with PHP 7.3.5).
but yours works great. here is an example of the output I wanted:
al3abmizo.com/games/shooting/play/5247

Code: Select all

<div class="rating" itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating">
 <meta itemprop="bestRating" content="5">
 <meta itemprop="worstRating" content="1">
 <meta itemprop="ratingValue" content="4.1">
 <meta itemprop="ratingCount" content="239">
</div>
- Which generate this:
i.ibb.co/vkKtnGh/rating-output.png

Thank you.

Similar Topics