Serialize form and combine with other value in ajax data [duplicate] - javascript

This question already has answers here:
jQuery: serialize() form and other parameters
(12 answers)
Closed 5 years ago.
I have Ajax like this.
var idlapkondisi = $('#id_laporan_pemeriksa').val();
var data = $('#myFormkondisi').serialize();
$.ajax({
type:'ajax',
method:'POST',
url:url,
dataType:'json',
success:function(response){
},
error:function(response){
console.log(response);
}
})
})
how can i make 2 value in ajax data while the value is a serialize data form ?
does the format like this ?
data:{data,idlapkondisi:idlapkondisi},

Use serializeArray instead of serializing.
var idlapkondisi = $('#id_laporan_pemeriksa').val();
var data = $('#myFormkondisi').serializeArray();
data.push({name: "idlapkondisi", value: idlapkondisi});
$.ajax({
type: 'ajax',
method: 'POST',
url: url,
data: data,
dataType: 'json',
success: function(response) {
},
error: function(response) {
console.log(response);
}
});

Try this to add that value to you payload:
var idlapkondisi = $('#id_laporan_pemeriksa').val();
var data = $('#myFormkondisi').serialize();
data["idlapkondisi"] = idlapkondisi;
Then you can add data to your Ajax call as usual.

Related

How to pass values from javascript to controller [duplicate]

This question already has answers here:
JQUERY ajax passing value from MVC View to Controller
(6 answers)
Closed 3 years ago.
I'm trying to pass the id and the value of some textboxes from the view to the controller. The ajax call works, but the value that it pass is always Null. How can i solve this problem??
This is the ajax call:
function TakeInput() {
var count = document.getElementsByTagName('input').length;
var element = document.getElementsByTagName('input');
for (var i = 0; i < count; i++) {
$.ajax({
type: 'POST',
url: '#Url.Action("Input", "Home")',
data: JSON.stringify(element[i].id, element[i].value),
processData: false,
success: function () {
//make something
},
error: function (errorThrown) {
alert(errorThrown);
}
})
}
And this is the controller:
public JsonResult Input(string id, string value)
{
//do something with the id and the value
return Json(new { result = "Success" });
}
Thanks in advance for your time and your answers.
If you are looping the ajax call ,you can bind an object and pass it to controller then you can iterate it in server side. Whatever according to your code you can try the below one
$.ajax({
type: 'POST',
url: '#Url.Action("Input", "Home")',
data: JSON.stringify({ id: element[i].id, value: element[i].value}),
dataType: 'json',
async: false,
contentType: 'application/json',
success: function () {
//make something
},
error: function (errorThrown) {
alert(errorThrown);
}
})
When you are making an ajax call you need to declare the parameter like you declared in your json result for example id,value etc and bind it into data attribute

Posting JSON with variable using Ajax in [duplicate]

This question already has answers here:
jQuery posting valid json in request body
(2 answers)
Closed 4 years ago.
I was trying to put variable into JSON. I want to post it using Ajax.
My code:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
var user_Details = "1528205024";
function checkUserForDashboard(){
$.ajax({
url: "api comes here",
type: "POST",
data: {"user_id": user_details },
dataType: "json",
crossDomain : true,
success: function (data) {
console.log(data);
}
})};
</script>
The post request gives: bad request error.
Enclose your JSON object into JSON.stringify() to ensure your json object is serialized in a safe string.
Also, set the content-type property.
$.ajax({
url: "api comes here",
type: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({"user_id": user_details }),
dataType: "json",
crossDomain : true,
success: function (data) {
console.log(data);
}
})};

can't get any file data, It shows file data empty [duplicate]

This question already has answers here:
jQuery AJAX file upload PHP
(5 answers)
Closed 5 years ago.
I did this for uploading files via ajax.
But I can't get any file data. It shows file data empty.
Here is my ajax part.
$("#personal_image").on('click',function(event) {
event.preventDefault();
var datastring = $("#personal_image").serialize();
console.log(datastring);
$.ajax({
type: "POST",
url: location.origin+"/user/parsonal_image_submit/",
secureuri :false,
fileElementId :'user_image',
data: datastring,
dataType: "json",
success: function(data) {
//success },
error: function() {
//error
}
});
})
Check below code. Hope it will work for you. Please use on form submit rather then using on click.
$('#your_form_id').on('submit',function(e){
e.preventDefault();
var formdata = new FormData($(this)[0]);
var url = $('#personal_image').attr('action');
$.ajax({
url: url,
type: 'post',
data: formdata,
dataType: 'json',
processData: false,
contentType: false,
//async: false,
success: function(data){
//success
}
});
});

Ajax post multiple data [duplicate]

This question already has answers here:
How to send multiple data fields via Ajax? [closed]
(12 answers)
Closed 6 years ago.
How to post multiple data using ajax? i want to post input value and attr both. Here is an example :
$('.input[type=\'text\']').keyup(function(){
$.ajax({
type: 'POST',
url: 'index.php',
data: $('.input[type=\'text\']'),
dataType: 'json',
success: function(json) {
alert('done');
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" attr="yes" />
As documented, "data" has mixed type (Type: PlainObject or String or Array). So you can assign array or object to data property.
Try following;
$('.input[type=\'text\']').keyup(function(){
var dataToPost = {
value: $(this).attr('attr'),
attr: $(this).val()
};
$.ajax({
type: 'POST',
url: 'index.php',
data: dataToPost,
dataType: 'json',
success: function(json) {
alert('done');
}
});
});
$('.input[type=\'text\']').keyup(function(){
var obj = {};
obj.val = $(this).val();
obj.attr = $(this).attr('attr');
$.ajax({
type: 'POST',
url: 'index.php',
data: obj,
dataType: 'json',
success: function(json) {
alert('done');
}
});
});
$('.input[type=\'text\']').keyup(function(){
var data = new FormData();
$el = $('.input[type=\'text\']');
data.append('value', $el.val());
data.append('attr', $el.attr('attr'));
$.ajax({
type: 'POST',
url: 'index.php',
data: data,
dataType: 'json',
success: function(json) {
alert('done');
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" attr="yes" />

Sending the array data in jquery get ajax call?

how we can send the Javascript array as a parameter in the ajax get call.
I am working with the API call and i have the API call method that has three parameters and the third one is the array.
You can do like this
demArray = [];
demArray[0] = 'hi';
demArray[1] = 'hello';
$.ajax({
type: "GET",
data: {arrayDem:demArray},
url: "someUrl",
success: function(response){
}
});
Also serialize() & serializeArray() can help you.
If you are getting those arrays from a form you could:
var form = $('#form').serialize();
$.ajax({
type: "GET",
data: form,
url: "foo.php",
success: function(data){
}
});
Else you could just pass the parameters into data: like:
data: {foo:Array}

Categories

Resources