I am developing a WordPress website on a localhost using WampServer.
I have a custom js file, custom-js.js
, file located at C:\wamp64\www\wordpress\wp-content\themes\my-theme\js
When a user click on a vote up button, I want to send the product ID via AJAX to a PHP file where I can edit the vote count in my SQL database. I also want to display a message to the user. The PHP file is called script.php
and is located at C:\wamp64\www\wordpress\wp-content\themes\my-theme\js\ajax
My code in the custom-js.js
file looks like this:
$(function() {
$(".product-vote-button-up").click(function(){
var productID = $(this).attr('productID');
var request = $.ajax({
url: "/ajax/script.php",
type: "POST",
data: {id : productID},
dataType : 'json',
});
request.done(function() {
$("#product-" + productID + " .item-product-footer-vote-container").html('Thanks for your vote!');
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
});
});
This code would always give me an error message localhost says: Request failed:error
I am not sure if the way I am writing the path for url:
is good and if it's the reason why I can't get a successful request. The path of my PHP script is relative to the path of the js file. Do I need to do any type of custom configuration to run AJAX on my local server?