I'm writing a basic API to learn how they work. It seems that using the DELETE method in the AJAX call prevents the passing of the value that was entered in the form along to the PHP script.
Here is the form:
<legend>Remove Mobile</legend>
<ol>
<li>
<label for="id">ID</label>
<input type="text" name="id" id="id"></input>
</li>
</ol>
<button type="button" onclick="deleteMobile()">Submit</button>
<button type="reset">Cancel</button>
</form>
Here is the jQuery AJAX call:
function deleteMobile() {
$.ajax({
method:"POST", // this needs to be DELETE for API, it is currently set to POST so form value passes to PHP script
url:"glue.php",
data: {id: $('input[name="id"]').val()},
async: true,
cache: false
})
.done(function(data){
// log data to console for visibility
console.log(data);
// clear contents of form
$('input[name="id"]').val('');
})
.fail(function(){
console.log('AJAX call failed');
})
Here is the glue.php script so far:
<?php
$id = isset($_POST['id']) ? $_POST['id'] : '';
header('Location: http://localhost:8080/miscellaneous/APIexamples/CRUD/mobile/' . $id);
?>
When these two lines are added to glue.php before header(...
echo ($_SERVER['REQUEST_METHOD']);
exit($id);
then POST
and whatever value was inputted into the form are displayed in the browser console. However, when the AJAX method is changed to DELETE then DELETE
appears in the browser console but not the form value. How can the form value be passed to the PHP script when the DELETE method is used in the AJAX call?