Develop Reference

Send multiple parameters to PHP (Ajax)

I'm stuck here when passing or sending multiple parameters on Ajax. It only works when I pass one. Here the Ajax code:
$.ajax({
type: "POST",
url: "dataCartas.php",
data: {valorXY: valorXY,
CentroX: CentroX},
success: function(msg){
// return value stored in msg variable
console.log(valorXY + CentroX)
}
});
And the PHP code:
$valorXY = $_POST['valorXY'];
$CentroX = $_POST['CentroX'];
include "configX.php";
if ($conn){
$sql="EXEC sp_InsertaComID #ComID = '".$valorXY."', #DR =
'".$CentroX."'";
if ($rs=sqlsrv_query($conn,$sql)){
}else{
echo (print_r(sqlsrv_errors(), true));
}
}else{
die(print_r(sqlsrv_errors(), true));
}
Sorry for my bad english :(

You can serialize a form
$.ajax({
type: 'post',
url: 'include/ajax.php',
data: $('#form').serialize(),
success: function (response) {
// do something
},
error: function(jqxhr,textStatus,errorThrown){
console.log(jqxhr);
console.log(textStatus);
console.log(errorThrown);
}
});
you can also use form data https://stackoverflow.com/a/8244082/3063429

Cannot retrieve data sent via js

I use the following to send the data:
$(".save_post").on("click", function() {
var saveId = $(".my_post_id").attr("data-id");
console.log(saveId);
$.ajax({
url: "save.php",
data :saveId,
type: 'POST',
success: function(json_object) {
console.log(json_object);
$(".save_post").text("Data has been saved.");
},
error: function(json_object) {
console.log(json_object);
$(".save_post").text("Failed to save data !");
}
});
});
Console value when I do console.log(saveId); is 248
And when I click the button to send the data, its text says: Data has been saved.
But when I open save.php i get an empty page.
PHP code:
<?php
$post_data = $_POST['data'];
echo $post_data;
?>
All I am trying to do is to save a javascript variable in order to be able to retrieve it later on.

You forgot to send a key with the value:
data: { data: saveId }
You should also use the data() method to get data-* attributes, not attr(). Here's a full example:
$(".save_post").on("click", function() {
$.ajax({
url: "save.php",
data: { data: $(".my_post_id").data("id") },
type: 'POST',
success: function(response) {
console.log(response);
$(".save_post").text("Data has been saved.");
},
error: function(x, s, e) {
$(".save_post").text("Failed to save data !");
}
});
});
Note that this is assuming you have only a single .my_post_id element. If you have multiple then data-id will only be read from the first one found in the DOM.
Also, there's no such thing as a 'JSON object'. The argument provided to the success handler is an object (or array) which has been deserialised from the JSON formatted string in the response.
Similarly, the error handler doesn't accept an argument which contains JSON, so that signature is incorrect. I'd suggest checking the jQuery $.ajax() documentation if you are unsure on what arguments are available to which jQuery AJAX handlers.

You need to send JSON data so that php can retrive the same data using key
$(".save_post").on("click", function() {
var saveId = $(".my_post_id").attr("data-id");
console.log(saveId);
$.ajax({
url: "save.php",
data : {'data':saveId}, // Add object
type: 'POST',
success: function(json_object) {
console.log(json_object);
$(".save_post").text("Data has been saved.");
},
error: function(json_object) {
console.log(json_object);
$(".save_post").text("Failed to save data !");
}
});
});

try this :
$post_data = $_POST;
echo $post_data;
It will works for you.

php sending values to ajax faild error

I Am trying to send value from ajax to php and retrieve it just to test that everything is work, when i click in a button to test i got error and alert('Failed') Appears , how can i fix it in order to get success? thanks
Ajax :
var a = "test";
$.ajax({
url: "search.php",
dataType: "json",
data: a ,
success: function(data) {
alert('Successfully');
},
error: function(data) {
alert('Failed');
}
})
PHP :
<?php
$pictures = "img1";
echo json_encode($pictures);
?>

I refined your code slightly and it works.
var a = "test";
$.ajax({
type: 'POST',
url: 'search.php',
data: 'a=' + a,
dataType: 'json',
cache: false,
success: function (result) {
alert('Successful');
},
error: function (result) {
alert('Failed');
}
});

If you're requesting a JSON, use the $.getJSON from jQuery, it's aready parse the JSON into a JSON object for you.
Seems that you're not return an actual JSON from server, maybe this is what is causing the error.
If you're seeing the 'Failed' message probably the problem is a 500 error which is a server error.
Try this code above.
Javascript:
var a = "test";
$.getJSON("search.php", {
a: a
}, function (json) {
console.log(json);
});
PHP:
<?php
$pictures = ["img1"];
echo json_encode($pictures);
The only way to this not work, is if you have a huge mistake on you webserver configuration.

Your ajax is wrong, it should be:
var a = "test";
$.ajax({
type: "POST",
url: "search.php",
dataType: "json",
data: {a:a},
success: function(data) {
alert('Successfully');
},
error: function(data) {
alert('Failed');
}
});

Fake path Javascript Issue

When I try to retrieve the File path it's shows me the result like this: "C:\fakepath\amine.jpeg" so the upload in the server is not working as a result of that problem.
$('input[type=file]').change(function () {
var filePath=$('#file-input').val();
$.ajax({
url : "{{path('upload_file')}}",
type : 'POST',
data: {
filePath : filePath,
method: 'post',
params: {
action: "uploadFile"
}
},
success : function(data, textStatus, jqXHR) {
alert(data);
}
});
});

You are doing this all wrong.
You have to create a form object and send it via $.ajax.
And I assume you have written the correct serverside code to save the image.
var f = new FormData();
f.append('img',document.getElementById("file-input").files[0]);
var url= "{{Your URL}}";
$.ajax({
url: url,
type:"post",
data: f,
dataType:"JSON",
processData: false,
contentType: false,
success: function (data, status)
{
console.log(data);
},
error: function (data)
{
if (data.status === 422) {
console.log("upload failed");
} else {
console.log("upload success");
}
});

Your file by default upload to a temporary folder. You need to move it to an actual location to get access to it like in php:
move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)
For reference, see http://www.w3schools.com/php/php_file_upload.asp

Variable not working in simple Ajax post

Can't seem to get the variable getID to work. I'm trying to change the html of the div. I know that the variable has the right value.
$('.cardid').change(function() {
var getID = $(this).attr('value');
$.ajax({
type: "POST",
url: "inc/change_thumbnail.php",
data: "id="+getID,
cache: false,
success: function(data) {
$("#"+getID).html(data);
alert("success");
},
error: function (err) {
alert("error");
}
});
});

Write data in $.ajax as data: {id : getID}, instead of data: "id="+getID,

Use val to get the value of an input :
var getID = $(this).val();
As you're making a POST request, you should also use the data argument to let jQuery properly send the value :
$.ajax({
type: "POST",
url: "inc/change_thumbnail.php",
data: {id:getID},
cache: false,
success: function(data) {
$("#"+getID).html(data);
alert("success");
},
error: function (err) {
alert("error");
}
});

You can try this:
$('[id="'+getID+'"]').html(data);
and yes you should pass it this way:
data:{id:getID}