Ajax 'POST' again after the data received is modified - javascript

I get the data from backend after Ajax post is being made, that data will have list of values. as user chooses a value from the list I want it to update to my object and post the ajax call again.
The problem I am facing here is I am not able to post again with chooses values, I need only one ajax call to do this. the nested ajax calls would not suffice
var searchObject = {
"research": "test"
}
$.ajax({
method: method,
data: JSON.stringify(searchObject), // while making next call the searchObject should have. "list":value of x in success
contentType: "application/json",
url: requestUrl
})
.success(function(data) {
var x = data.list2
}).error(function() {
});

I think that u can use syn ajax request rather than asyn request.You can see it from the jquery api Jquery ajax
And and you can try code like this:
var searchObject = {
"research": "test"
}
let x = undefined;
$.ajax({
async:false,
method: method,
data: JSON.stringify(searchObject), // while making next call the searchObject should have. "list":value of x in success
contentType: "application/json",
url: requestUrl
})
.success(function(data) {
x = data.list2
}).error(function() {
});
//Another syn ajax post
$.ajax({
async:false,
method: method,
data: JSON.stringify(x), // while making next call the searchObject should have. "list":value of x in success
contentType: "application/json",
url: requestUrl
})
.success(function(data) {
console.log(data)
}).error(function() {
});

If you're using POST with Ajax, this should do it for you. Just create a file and called it testing.php and enter a value in the input field and you'll see that ajax sends data to backEnd successfully. Hope it helps!
<?php
$data = array();
if(isset($_POST['research'])){
$data = $_POST['research'];
echo json_encode($data);
die();
}
?>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form>
Enter value: <input type="text" id="someID"><br>
<input value="submit" type="submit">
</form>
<p id="msg"><p/>
<script type = "text/javascript">
$("form").on("submit", function(e){
e.preventDefault();
var emailfield = $("#someID").val();
var myText ='You entered: ' + emailfield;
$.ajax({
url: "testing.php",
method: "POST",
dataType: "json",
data: {research: myText},
success: function (result) {
alert("result: " + result);
$("#msg").html(result);
},
error: function (params) {
alert("error");
}
});
});
</script>
</body>
</html>

Related

Pass variable via ajax to api.php

I am trying to pass a js variable via ajax to the php side. My js code is:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
var sAgentId = 'hi'
$.ajax({
url: "api-test.php",
method: "POST",
data : { id:sAgentId}
}).done(function(){
console.log('done')
})
and in the php file, I am trying to get the variable via post:
$sAgentId = $_POST['id'];
But finally in api i get the notification that says
Notice: Undefined index: id in C:\xampp\htdocs\webdev-php-exam-prep\exercise\api-test.php on line 2
Can anyone tell me what I am doing wrong?
Try adding this to your AJAX method:
dataType: "json"
Try also console logging the response back to check $_POST['id'] is being set.
.done(function(data) {
console.log("Data: ", data);
});
and in your PHP just return $_POST['id']
var sAgentId = 'hi'
$.ajax({
url:'api-test.php',
type: "POST",
data: {id: sAgentId },
cache: !0,
dataType: 'json',
success: function(data) {
console.log(data);
}
});
try replace method by type:
type: "POST",

AJAX jQuery doesn't display returned data

I have a script to fetch data and load it in a div, the code works fine and display the user id list if I don't use any form value and if I don't use type="POST", but it doesn't work (no result and no console error message) when I use $_POST values :
HTML :
<form name='newUser' id="searchForm" method="POST">
<input type="text" name="look_for" id="look_for">
<input type="text" name="lookage_from" id="age_from">
<input type="text" name="age_to" id="age_to">
</form>
fetchusers.php
$look_for = $_POST['look_for'];
$age_from = $_POST['age_from'];
$age_to = $_POST['age_to'];
$array = getProfilePicsList($look_for,$age_from,$age_to); //a function that select * from ...
echo json_encode($array);
jquery code:
$("#searchForm").submit(function(event)
{
$.ajax({
type: 'POST',
url: 'models/fetchUsers.php', //the script to call to get data
dataType: 'json', //data format
success: function(data) //on recieve of reply
{
$.each($(data), function(key, value) {
$('#itemContainer').append(value.user_id);
});
}
});
return false;
});
In your ajax request, you are missing the data. just add this:
data: $("#searchForm").serialize(),
Example:
$.ajax({
type: 'POST',
url: 'models/fetchUsers.php', //the script to call to get data
dataType: 'json', //data format
data: $("#searchForm").serialize(),
success: function(data) //on recieve of reply
{
$.each($(data), function(key, value) {
$('#itemContainer').append(value.user_id);
});
}
});
Without using data param, you can't get the values in $_POST array.
Some References:
https://api.jquery.com/jquery.post/
http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

I am passing an ajax to php with datatype as JSONP,but showing undefined index in php file

On submit button click,
I am passing a variable to sendmail.php.It's showing that contactname is undefined in php.
why is it happening ?
Here is my Code :
var name = document.getElementById('stream_cotactname').value;
alert(name);
$.ajax({
url: "sendmail.php",
async: false,
type:"POST",
data : "cotactname="+name+"file=" + formdata,
dataType: "jsonp",
contentType: false,
processData:false,
jsonp: "jsoncallback",
success: function(html){
alert("Thank you. We will be in touch with you");
},
error: function(){
alert("Thank you. We will be in touch with you");
}
});
My Php File:
<?php
$name =$_POST['cotactname'];die("A".$name);
?>
ALL gone well,Thanks.
Now let my introduce my exact code:
<script type="text/javascript">
var formdata = false;
(function () {
var input = document.getElementById("uploaded_file");
formdata = false;
formdata = new FormData();
input.addEventListener("change", function (evt) {
var i = 0, len = this.files.length, img, reader, file;
for ( ; i < len; i++ ) {
file = this.files[i];
if (formdata) {
formdata.append("uploaded_file[]", file);
}
}
}, false);
}());
</script>
HOw can I get the form data information in php (like we do as $_FILES)
If you are not using cross domain call then you can call ajax like this:
$.ajax({
url: "sendmail.php",
async: false,
type:"POST",
data : {cotactname:name},
dataType: "json",
contentType: 'application/x-www-form-urlencoded',
success: function(html){
alert("Thank you. We will be in touch with you");
},
error: function(){
alert("Thank you. We will be in touch with you");
}
});
try to change your data sending for more https://api.jquery.com/jQuery.ajax/
data : {cotactname:name},
also try to check console for any error is post ok on that file or try with correct path of file
You are sending a string from ajax and getting value of variable.
Try this:
CHANGE
data : "cotactname="+name,
TO
data: {"cotactname" : name},

POST a JSON data on a Server URL using Javascript

I have prepared a JSON data and I need to post it on the server so that a service can be called. URL to the server is available and I am making an AJAX call for the same to
POST the data.
But I dont know where to place the JSON string that is generated.
My Code is as Follows:
function postJSONData(JSONData, localMode)
{
var localJSONData = JSONData;
var postMode = localMode;
$.ajax({
type: 'POST',
url: 'https://tt.s2.com/tmobile/subscribe-service/uid=ankit_bharat_tanna',
dataType: 'xml',
success: function(data){
alert("SECOND POST JSON DATA");
} // Success Function
}); // AJAX Call
alert("POST JSON ------------> "+localJSONData +" "+postMode);
}
I want to post JSON data to the server URL. any Parameters to be used?
Thanks,
Ankit.
You should pass the values with data parameter $.ajax() jquery doc link
function postJSONData(JSONData, localMode)
{
var localJSONData = JSONData;
var postMode = localMode;
$.ajax({
type: 'POST',
url: 'https://tt.s2.com/tmobile/subscribe-service/uid=ankit_bharat_tanna',
contentType:"application/json; charset=utf-8",
dataType:"json"
data: JSONData
success: function(data){
alert("SECOND POST JSON DATA");
} // Success Function
}); // AJAX Call
alert("POST JSON ------------> "+localJSONData +" "+postMode);
}
You are missing the data parameter. Moreover you need to send json data so dataType parameter should be set to json. Below is an Example
function postJSONData(JSONData, localMode)
{
var localJSONData = JSONData;
var postMode = localMode;
$.ajax({
data: localJSONData,
type: 'POST',
url: 'https://tt.s2.com/tmobile/subscribe-service/uid=ankit_bharat_tanna',
dataType: 'json',
success: function(data){
alert("SECOND POST JSON DATA");
} // Success Function
}); // AJAX Call
alert("POST JSON ------------> "+localJSONData +" "+postMode);
}

Can I send the value of html like this $("#id").html() to code behind?

I have already tried it via ajax but it doesn't work so Help me please !!!!!!
And i tried it into cookie but in code behind didnt see it
var datah = $(“#currid”).html()
var data = {
id: currid,
html: datah
};
$.ajax({
type: "POST",
url: url,
data: data,
success: function(msg){
alert( "return back" );
}
});
Try this
You must encode the html content before transmitting . You can use escape in java script for this.And you can decode back it from server
var encodedData= escape($(“#id”).html()) ;
var postData = { htmlData:encodedData};
$.ajax({
type: "POST",
url: url,
data: postData,
success: function(msg){
// do your operation
}
});

Categories