0
121
ViewsAJAX shows an error on the url I am trying to post the data to
I am trying to make a page which will POST an array to the next page using AJAX, so that it can be accessed by PHP. https://www.kvcodes.com/2015/10/passing-javascript-array-to-php-through-jquery-ajax/
I have used the first example on this page as a tutorial. This is the code on the first page
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
if (sessionStorage.getItem('idsarray') !== '') {
var string = sessionStorage.getItem('idsarray');
const array = string.split(",");
array.shift();
console.log(array)
$.ajax({
type: "POST",
url: "detailselection.php",
data: { idsarray : array },
success: function() {
alert("Success");
}
});
$('#continuebutton').on("click", location.href = "detailselection.php");
}
This is supposed to post my array to the next page detailselection.php and then open that page but I get this error in console, even though the alert shows success
Can someone tell me what this means and how to solve it?
Edit: I replaced the AJAX url with the full url (http://localhost/.php/detailselection.php) and that gave me the exact same error. Then I tried changing the location.href as well which gave the same error, but updated to reflect the new url. This means that the error is on the location.href line, not the AJAX url like I had first thought. However the error does seem to be related to the AJAX because when I remove it there is no error.
Edit #2: I have also tried code like this which opens the next page inside the success function. This does not show any error message, but the variable is still not being passed to the next page
$('#continuebutton').on("click", function () {
$.ajax({
type: "POST",
url: "http://localhost/.php/detailselection.php",
data: { variable: 'yes'},
success: function() {
alert("Success");
window.location
= "http://localhost/.php/detailselection.php";
}
});
})
Just to confirm I am understanding AJAX correctly, the url is the page you are posting TO not the page you are taking the variable FROM, correct?
1 answers
Answer question0
I think the problem is that you are not supplying a valid url for AJAX to post to. You need to specify a domain to fetch detailselection.php from.
if (sessionStorage.getItem('idsarray') !== '') {
var string = sessionStorage.getItem('idsarray');
const array = string.split(",");
array.shift();
console.log(array)
$.ajax({
type: "POST",
url: "myDomain/detailselection.php",
data: { idsarray : array },
success: function() {
alert("Success");
}
});
$('#continuebutton').on("click", () => {
location.href = "myDomain/detailselection.php"
});
}
Also, don't forget to specify your port number in the url, especially in developement, since by default the browser requests to port 80 for http requests and port 443 for https requests. If you are using ports other than those, (which you probably are in development, since ports below 1024 are reserved), you will need to specify the port in the url. So for example, if you serve your files on port 3000, your url will be 127.0.0.1:3000/path/to/your/file
Note: As others have mentioned, you must supply a function to the event listener, as opposed to a simple equals.