i'm acing an issue to print the data result i got from an ajax call in another page. The code works fine if a print the result on the same page .
below my code which is inside a ready function
$("body").delegate(".selectitem","click",function(event){
$("#get_item_detail").html("<h3>Loading..why.</h3>");
event.preventDefault();
var cidd = $(this).attr('cidd');
$.ajax({
url : "action.php",
method : "POST",
data : {get_seleted_item:1,product_id:cidd},
success : function(data){
$("#get_item_detail").html(data);
}
})
})
Related
I am trying to get current location of user.
I have JS script to get current Latitude and Longitude with AJAX to send js variables to index.php.
$(document).ready(function() {
if ("geolocation" in navigator){
navigator.geolocation.getCurrentPosition(function(position){
var userLat = position.coords.latitude;
var userLong = position.coords.longitude;
console.log(userLong);
console.log(userLat);
$.ajax({
type: 'POST',
url: 'index.php',
data: {
userLat : userLat,
userLong : userLong
},
success: function(data)
{
console.log(data);
}
});
});
}else{
console.log("Browser doesn't support geolocation!");
}});
Then I am trying to do this in my index.php:
echo $_POST['userLat'];
echo $_POST['userLong'];
Nothing shows up. Thanks in advance.
Nothing shows up.
And that's correct you will never get any thing by browsing index.php because there is no POST at this time , AJAX is internal and the only way to show a result from index.php is in the page that you send from it an ajax call.
At this :
success: function(data)
{
console.log(data);
}
you could control where to show your data that comes from index.php by , for example alert(data) or document.getElementById("someelement").innerHTML=data; and so on.
It might help to define and return a dataType for the ajax.
add this to your list of ajax options
dataType: 'json',
Then in index.php encode and echo a json string. Remove the lines
echo $_POST['userLat'];
echo $_POST['userLong'];
replace them with
echo json_encode($_POST);
The console.log(data); in the success function should show an object with two items: 'userlat' and 'userLong' and associated values for each. Or it should if $_POST had those two items.
If you want the browser screen to update you will have to take data and use it to modify the DOM.
I'm calling a GET request from a jQuery AJAX function, but the GET request doesn't seem to be calling properly. After running the script, the address bar only shows "index.php?", instead of the expected "index.php?searchterm=searchterm".
index.php
$(function(){
$("form").submit(function(){
var searchterm = document.getElementByID("searchterm").value;
$.ajax({
method: "GET",
url: "search.php",
data: searchterm
})
.done(function(res) {
document.getElementById("item1").innerHTML = res;
});
});
});
If it's any relevance, here is search.php
<?php
if ($_SERVER['REQUEST_METHOD'] == 'GET') {
$searchterm= isset($_GET['searchterm']) ? $_GET["searchterm"] : '';
exec("C:\Users\Callum\AppData\Local\Programs\Python\Python35-32\python.exe search.py $searchterm", $output, $result);
echo $result[0];}
?>
Correct data in ajax call as :
.......
$.ajax({
method: "GET",
url: "search.php",
data : { searchterm : searchterm } // Change here
})
.......
According to docs ,data in ajax call is data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. Object must be Key/Value pairs.
Reference
You should open the firebug console and see if you ajax request is visible there. If it is visible you can click on it and you will see what data it is passing to the requested url search.php
Also You didn't pass the data correctly using ajax. And if you are using ajax then browser address bar will not be updated as the page is not getting reloaded.
$(function(){
$("form").submit(function(){
var searchterm = document.getElementsByID("searchterm").value;
$.ajax({
method: "GET",
url: "search.php",
data: { searchterm : searchterm }//This is how to pass data correctly
})
.done(function(res) {
document.getElementById("item1").innerHTML = res;
});
});
});
the data property of the ajax function is an object so it should look like this:
data: { searchterm: searchterm }
I am processing my html form with jquery / ajax request. It's calling by jquery 'change()'. So when request is success it's showing me success result which is
Successfully Updated
Well, but if it again request it's showing
Successfully UpdatedSuccessfully Updated
It's just added last success result text to new one. I want to show only onnce. Can you tell me why it's happening ?
my code:
$("#corp_www_eng, #domestic_www_japaness").change(function(){
var cid = $("#cid").val();
var corp_www_eng = $("#corp_www_eng").val();
var domestic_www_japaness = $("#domestic_www_japaness").val();
$.ajax({
url: 'edit_companyinfo.php',
type: 'POST',
dataType: 'html',
data: {
"cid" : cid,
"corp_www_eng" : corp_www_eng,
"domestic_www_japaness" : domestic_www_japaness,
},
}).done(function ( data ) {
$('#result').append(data);
$('#result').show();
$('#result').delay(3000).fadeOut('slow');
});
});
Try substituting .html() for .append()
$("#result").html(data);
I believe it is because your are appending the data to the #result div. You could try adding
document.getElementById('result').innerHTML = '';
This would clear that div of any content before appending the new content.
I want to check if my user is updated from another system using javascript.
I need help writing a function which checks a json response. If it is true or false.
The url /user/updatecheck/ has a json response like this: {"updated": "true"} or {"updated": "false"}
<script type="text/javascript">
$(document).ready(function() {
var updated='2013-01-02T10:30:00.000123+02:00'; //user variable from the system, will be empty if the user is not updated
if (!updated){
$('#not-updated').modal('show');
var updatedCheck = window.setInterval(
$.ajax({
url: "/user/updatecheck/", //Returns {"updated": "true"} or {"updated": "false"}
data: dataString,
dataType: "json",
success: function(data){
if (json.updated == 'true') { //not sure if this is the correct method
window.clearInterval(updatedCheck);
//The user is updated - the page needs a reload
}
} //success
})
, 3000); //Hoping this is the function to check the url every 3 seconds until it returns true
}
});
$(document).ajaxStop(function(){
window.location.reload();
});
</script>
It does not seem to work. Not sure if my ajax function is correct, I only get the modal window if the user is not updated at first, and the page does not reload if the url /user/updatecheck/ returns true.
The way you call jQuery ajax function as part of the setInterval is not proper. Please try placing it within a function,
var updatedCheck = window.setInterval(
function(){$.ajax({
url: "/user/updatecheck/", //Returns {"updated": "true"} or {"updated": "false"}
data: dataString,
dataType: "json",
success: function(data){
if (json.updated == 'true') { //not sure if this is the correct method
window.clearInterval(updatedCheck);
//The user is updated - the page needs a reload
}
} //success
})}
, 3000);
The data that you will receive from the ajax request is returned via the data parameter of you success callback function, so you can use that. Try to print the data result to the console (i.e. console.log(data);)or alert it (i.e. alert(data);). For instance you may need to call data.updated. I'm not sure if the json variable you are using in the if condition is initialised.
I'm not sure how to ask this question but I'll just describe my problem:
I have this variable:
var htmlvalues = '';
then I have an ajax code:
#for loop here
$.ajax({
url : 'dasdasdas',
...
....
....
success : function (data) {
#now this is my problem here:
$.ajax({
url : 'dasdsa',
........
.............
success : function (data again) {
htmlvalues += 'some html values to concatinate';
}
});
});
#end of for loop here
So after that loop ends I want to display that html values:
$(".tech-file-upload-dialog").html( htmlvalues );
In a dialog box like above. But it will just display an empty dialog box, I suspect It cant get those values inside the deeper part of ajax. I can see through console.log that my data are being concatinated successfully, it just can't reach the dialog box part.
Use async:false, so your code might look like.
var htmlvalues = '';
#for loop here
$.ajax({
async: "false",
url : 'dasdasdas',
...
....
....
success : function (data) {
#now this is my problem here:
$.ajax({
async: "false",
url : 'dasdsa',
........
.............
success : function (data again) {
htmlvalues += 'some html values to concatinate';
}
});
});
#end of for loop here
$(".tech-file-upload-dialog").html( htmlvalues );
Define your function as
...
success: function(data) {
//do something
}
This way the function will get the response from the server parsed according to dataType you define in the call so you will have access to the data you need.