trying to make ajax call work with php and mysql - php

Question

I have the following set up for my ajax call but it is not working when I click on a star (this is a star rating), Although if i access the ajax.php directly it inserts, but the ajax call is not happening.
html in php file
echo '<table>
<tr>
<td style="padding:10px;">
<input type="hidden" name="userID" value="'.$user_id.'">
<span style="font-size: 20px; vertical-align:top;">Comments</span>
</td>
<td style="padding:10px;">
<textarea name="comments" cols="60" rows="2"></textarea>
</td>
<td>
<div>
<input name="star1000" value "1" type="radio" class="star"/>
<input name="star1000" value="2" type="radio" class="star"/>
<input name="star1000" value="3" type="radio" class="star"/>
<input name="star1000" value="4" type="radio" class="star"/>
<input name="star1000" value="5" type="radio" class="star"/>
</div>
</td>
<tr>
</table>';
JS - being used to send the values
<script>
$('.star').rating({
callback: function(value, link) {
var name = $(this).attr('name');
var userID = $(this).closest('td').find('input[name="userID"]').val();
var comments = $(this).closest('td').find('textarea[name="comments"]').val();
$.ajax({
url: "http://localhost/mywebsite/ajax.php",
type: "POST",
data: {
name: name,
value: value,
userID: userID,
comments: comments
},
cache: false,
success: function(response) {
try {
console.log(response);
} catch (err) {
alert(response);
}
}
});
}
});
</script>
My ajax.php located at http://localhost/mywebsite/ajax.php
<?php
extract($_POST);
$rate_val = $_POST['value'];
$user_id = $_POST['userID'];
$comments = $_POST['comments'];
$insert_q = "INSERT INTO ratings (rate_comments, rate_num, option_id, rate_date,user_id)
values ('$comments','$rate_val','1',now(),'$user_id')";
include 'opendbconn.php';
if(!($result = mysql_query($insert_q, $database)))
{
print("Could not execute query!<br/>");
die(mysql_error()."</div>
</div>
</body>
</html>");
}
include 'closedbcon.php';
?>

Answer 1

You have to bind the event click with your function .rating() so javascript knows that it has to execute the function .rating() when ".star" is clicked.
You could do it like this:
$(document).ready(function(){
//other javascript code...
$('.star').bind('click',function(){
//your rating function
});
});