In my js class, I am sending form data via ajax to the php that is fine but I have an array which doesn't belong to that form how can I send it with form data
$("#formed").unbind('submit').bind('submit', function() {
$.ajax({
url: form.attr('action'),
type: form.attr('method'),
data:new FormData(this),
dataType: 'json',
cache: false,
contentType: false,
processData: false,
async: false,
success: function(response) { }
});
});
Now there is array
var myList = new Array();
It doesn't belong to form but I want to send it making a json array with above ajax call?
ANY SOLUTION!!!!!
you can use this function formData.append(name, value);
$("#formed").unbind('submit').bind('submit', function() {
var data = new FormData(this);
var myList = [];
// add your data here
// to send an array as data you should convert it to the string
data.append('testField', JSON.stringify(myList));
$.ajax({
url: form.attr('action'),
type: form.attr('method'),
data:data,
dataType: 'json',
cache: false,
contentType: false,
processData: false,
async: false,
success: function(response) { }
});
});
Related
I am trying to pass value through an ajax json array but value of catergory variable is not getting in controller action
var category = $('#category').val();
var url = $('#ajax_action_search').val();
$.ajax({
type: "POST",
data: {
'category': category
},
dataType: "json",
cache: false,
contentType: false,
processData: false,
success: function(response) {}
});
You need to use the parameter namespace matching your extension/plugin:
$.ajax({
// ...
data: {
'tx_myext_foo[category]': category,
},
// ...
});
But you'll also need to configure the cHash evaluation since this will lead to a HTTP request like /?tx_myext_foo[category]=X which will fail without a matching cHash.
This can be done with the excludedParameters configuration option.
Please check the Controller action if category (parameter name) passed from the ajax is exactly same in the controller action too
var category = $('#category').val();
var url = $('#ajax_action_search').val();
$.ajax({
type: 'POST',
contentType: "application/json; charset=utf-8",
cache: false,
async: false,
url: url,
data: JSON.stringify {
category: category
},
dataType: 'json',
success: function(response) {}
});
You need to make ajaxurl with action and controller. and then pass the data in full format.
var ajaxUrl = '<f:uri.action action="youraction" controller="Yourcontroller" />';
var category = $('#category').val();
$.ajax({
type: 'POST',
url: ajaxUrl,
data: '&tx_yourext_yourplugin[category]='+category,
success: function(response) {
},
});
Just make the following changes :
var category = $('#category').val();
var url = $('#ajax_action_search').val();
$.ajax({
type: "POST",
url:url,
data: {'category': category},
dataType: "json",
success: function(response) {}
});
I'd like to pass a PHP session variable (called 'profileid') using FormData and AJAX. I thought this below would work, it did not. Why?
var imageData = new FormData();
imageData.append('image', $('#uploadImage')[0].files[0]);
imageData.append('profileid', <?php echo $_SESSION['profileid'];?>);
//Make ajax call here:
$.ajax({
url: '/upload-image-results-ajax.php',
type: 'POST',
processData: false, // important
contentType: false, // important
data: imageData,
//leaving out the rest as it doesn't pertain
You could add the profileid in the $.ajax URL parameter instead of adding it in FormData:
$(document).ready(function (e) {
$('#uploadImageForm').on('submit',(function(e) {
e.preventDefault();
var formData = new FormData(this);
$.ajax({
url: "/upload-image-results-ajax.php?profileid=<?= $_SESSION['profileid']; ?>",
type: "POST",
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(response){
console.log("success");
console.log(response);
},
error: function(response){
console.log("error");
console.log(response);
}
});
}));
$('#uploadImage').on("change", function() {
$("#uploadImageForm").submit();
});
});
Don't forget to place session_start(); at the beginning of your code.
I am trying to add images, few string information and array using formData. I can successfully add images, string but can't add array information while adding. It always passes array as a string.Any help would be appreciated. My code
var reader = new FileReader();
var form_data = new FormData();
form_data.append('departure_city',departure_city);
form_data.append('inclusion_icons', inc_icons);
form_data.append('theme_icons',theme_icons);
$.ajax({
url: url,
type: "POST",
async: false,
cache: false,
contentType: false,
processData: false,
enctype: 'multipart/form-data',
data: form_data,
}).done(function (data) {
console.log("Success");
console.log(data);
}).fail(function (data) {
console.log("Error");
console.log(data);
});
inclusion_icons and theme_icons are arrayz, however I'm getting them as a string.
I need to send data with id,name , and file (PdfBytes) byte[] with ajax to my service.
How can i add my PDF file to var pdf and add it to my ajax.
My code
var PdfBytes;
//Tried to fill PdfBytes with get,didnt work
$.get('http://testservices.xxx/PdfService/MYTest.pdf', function(data)
{
PdfBytes=data;
});
var ConvertHtmlToPdfAndSendEmail = {
"PdfBytes":PdfBytes,
id": id,
"Name": name
};
$.ajax({
type: "POST",
data: JSON.stringify(ConvertHtmlToPdfAndSendEmail),
dataType: 'json',
url: "http://testservices.xxx/ConvertHtmlToPdfAndDownload",
contentType: 'application/json; charset=utf-8',
async: true,
cache: false,
success: function (result) {
//my code
},
error: function (req, err) {
//my code
}
})
In the server i get PdfBytes is null
function expect to get byte[] PdfBytes
Sow how i can upload my pdf from my pc to var PdfBytes ,and send it in ajax to my service.
There two way to send byte[] in Ajax
You convert byte[] to string for GET or to json for POST
=> The main thing you should convert to byte array to text
and recover the data format when call the server script
$.ajax({
type: "GET",
url: "http://testservices.xxx/ConvertHtmlToPdfAndDownload?data="+encodeURI(byte_array.join())
});
$.ajax({
type: "POST",
dataType: "json",
data: JSON.stringify(byte_array),
url: "http://testservices.xxx/ConvertHtmlToPdfAndDownload"
});
Hope it help!
I think you should use option call 'async' so do that:
var PdfBytes = $.ajax({
url: 'http://testservices.xxx/PdfService/MYTest.pdf',
type: 'GET',
async: false
});
var ConvertHtmlToPdfAndSendEmail = {
PdfBytes: PdfBytes,
id: id,
Name: name
};
$.ajax({
type: "POST",
data: JSON.stringify(ConvertHtmlToPdfAndSendEmail),
dataType: 'json',
url: "http://testservices.xxx/ConvertHtmlToPdfAndDownload",
contentType: 'application/json; charset=utf-8',
async: true,
cache: false,
success: function (result) {
//my code
},
error: function (req, err) {
//my code
}
});
Hope it help.
<script type="text/javascript">
$(document).ready(function(){
$("#btnUpdate").click(function(){
alert($("#frm_data").serialize());
var formData = new FormData($("#frm_data")[0]);
var Desc= CKEDITOR.instances.editor1.getData();
$("#btnUpdate").attr('value', 'Please Wait...');
$.ajax({
url: 'update_job.php',
data: formData,
cache: false,
contentType:false,
processData:false,
type: 'post',
success: function(response)
{
$("#btnUpdate").attr('value', 'Update');
}
});
return false;
});
})
</script>
i use ckeditor for textarea field. but its can update value with new value, so i want to use another way with send textarea value with form data.
so how to send Desc data with fromData. in ajax.
To achieve this you can use the append() method of FormData to add whatever additional information you require:
$("#btnUpdate").click(function(e) {
e.preventDefault();
var $btn = $(this).attr('value', 'Please Wait...');
var formData = new FormData($("#frm_data")[0]);
formData.append('desc', CKEDITOR.instances.editor1.getData());
$.ajax({
url: 'update_job.php',
data: formData,
cache: false,
contentType: false,
processData: false,
type: 'post',
success: function(response) {
$btn.attr('value', 'Update');
}
});
});