Develop Reference

Why does PHP does not receive the post request that made by AJAX

This is my javascript code, the success event get executed. However the post array remains empty in php file.
document.querySelector(".postButtons").addEventListener("click",(e)=>{
const postID = e.target.value;
if(e.target.id == "edit"){
//Send post request to edit the post
$.ajax({
type: 'POST',
url: '../edit.php',
data: {postID : postID},
contentType: 'application/json; charset=utf-8',
data: 'json',
cache: false,
success: function(response) {
window.location.href="../edit.php"
},
error: function(err){
console.log(err)
}
})
}else if(e.target.id == "del"){
//Send post request to delete the post
}
})
<?php
if(isset($_POST["postID"])){
echo $_POST["postID"];
}
?>
I have tried to log the variable to console in javascript, it seems working.The status code was 200 when i tried to return it.

window.location.href performs a regular GET request. Therefore, you do not see postID on the page. you can see the postID in the console in the request
But if you want to see the postID when the page reloads, then you need to send this request using the form, not the ajax.
<form action="../edit.php" method="POST" id="sendForm">
<input type="hidden" name="postID" id="postID">
<input type="submit">
</form>
if(e.target.id == "edit"){
$('#postID').val(postID);
$('#sendForm').submit();
}

Fill Data to control from success response which is on another page

I bring my ajax response on success call and after that I want to redirect to new aspx page where all my 30 input type text controls are their. So What I want is I want to fill all the values their. So how could I achieve it. Please suggest.
Here is what I tried till now
function getDataForDashboard(rjSapId) {
$.ajax({
type: "POST",
url: "Dashboard.aspx/GetDashboardDataOnFacId",
data: JSON.stringify({ rjSapId: rjSapId }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
window.location.href = "http://localhost:39800/DashboardData.aspx?Id=" + rjSapId + "";
},
error: function (response) {
alert('Something went wrong..!!');
}
});
}
The another page some controls are below:-
<span>Site Type:</span>
<input type="text" id="txtSiteType" />
<br />
<span>Facility Type:</span>
<input type="text" id="txtFacilityType" />
<br />

May be you can save all your data in a hidden field by doing a stringify or, save it in local storage and then in the next page ajax ready you can retrieve it

Uploading a file from a bootstrap modal using ajax

I am attempting to upload a file to a server from a bootstrap modal window, using ajax.
The modal html is
<div class="modal-body">
<div>
<form class="form" role="form" id="attachform" enctype="multipart/form-data">
<input type="file" name="file" id="file">
<button type="submit" class="btn btn-primary">Upload</button>
</form>
</div>
</div>
The Javascript
$("#attachform").on('submit',function(event){
event.preventDefault();
var postData = new FormData($("#attachform")[0]);
console.log(postData);
$.ajax({
url: "attachment.php",
type: "POST",
data: data,
processData: false, // tell jQuery not to process the data
contentType: false
}).done(function(msg) {
console.log(msg);
$('#myAttachModal').modal('hide');
});
});
});
The PHP server code
print_r($_POST);
print_r($_FILES);
I am not seeing anything in the $_FILES array when I run this.
Any suggestions?

Change the data value in your Ajax post to postData. postData contains the form data.
Change this section
data: data,
To
data: postData,//this contains the form data

You just need to change the data : data kew value inside the
$.ajax({
data : postData,
});

$.ajax({
url: "attachment.php",
type: "POST",
data: postData,
processData: false, // tell jQuery not to process the data
contentType: false
}).done(function(msg) {
console.log(msg);
$('#myAttachModal').modal('hide');
});
});
});

Google recaptcha : How to access the response

For the HTML part, I have google REcaptcha widget like below
<form id="test" action="?" method="POST>
<div style="width: 298px!important;margin-left:-1px;" class="g-recaptcha" data-sitekey="6Lf2_Q4UAAAAAOf0NDqKDpEHncrFuKBRuw5bJfSO"></div>
<input type="submit" type="button" id="signin-button" class="signin-button" value="Login" />
</form>
And by the time when the user clicks on the submit button, it should run a little Ajax function and see if the result is true then the page should be redirected somewhere else otherwise it should remain the same and display an error message.
I have my ajax code below, I am nearly finished the function but I have no idea how may I get the response value for the field.
$("#signinform").on('submit', function(e) {
var ReCaptchaDetail = {
secret: "6Lf2_Q4UAAAAAOf0NDqKDpEHncrFuKBRuw5bJfSO",
response : $("#recaptcha-token").attr("value"),
//can't get the response value
//remoteip: , //optional
};
console.log(ReCaptchaDetail)
$.ajax({
url: 'https://www.google.com/recaptcha/api/siteverify',//getting the goggle api
data: JSON.stringify(ReCaptchaDetail),
type: 'POST',
contentType: "application/json; charset=utf-8", //must decode
dataType: "json", //must define data type
success: function(data){
console.log(data);
}
});

Getting an "Unsupported media type-415" on an ajax call- Jquery,ajax

I'm calling an ajax function to update a certain record and I'm getting a 415-Unsupported Media type. Below is the js:
$("#update").on("click", function(){
event.preventDefault();
return $.ajax('/update/record',{
method: 'PUT',
data:{
date: date
},
success: function(){
alert("record updated successfully");
}
});
html:
<form>
<button type="submit" id="update-cc">Update</button>
</form>
I don't know what I'm doing wrong here or what I need to add to get the correct form of the ajax call.Any ideas????
Thanks!

I believe you need to set the contentType and dataType in your ajax request
contentType: "application/json",
dataType: "json",