Jquery AJAX posting variable to server file - javascript

Using Jquery AJAX to read a number from a server file, increment the number, and write the number back to the server file.
I can read the file fine, I just can't post to the file.
<script>
var counter = -1;
$.ajax({
type: "GET",
url: "counter.txt",
success: function(text) {
counter = text;
counter++;
$("#count").html(counter);
},
error: function() {
$("#count").html("Error!");
}
});
$.ajax({
type: "POST",
url: "counter.txt",
data: counter,
success: function() {
},
});
</script>

Ajax being a client-side method can't write to a file on the server.
You would need some middleware in PHP, ASP, Python etc to take the amends as posted data and write to the file.

Since Ajax is asynchronous, this piece of code
$.ajax({
type: "POST",
url: "counter.txt",
data: counter,
success: function() {
},
});
will be executed before you will get first number from server. You need to put this code inside "success" function
$.ajax(
type: "GET",
url: "counter.txt",
success: function(text) {
counter = text;
counter++;
$("#count").html(counter);
$.ajax({
type: "POST",
url: "counter.txt",
data: counter,
success: function() {
},
});
},
error: function() {
$("#count").html("Error!");
}
});
Also, you should just call some server side php method through Ajax, since you can't set anything through JavaScript on server.
So "post" Ajax URL should looks like
url: 'http://www.server.ca/set_vars?var=var_title&value=' + encodeURIcomponent(counter)

Related

How to send current URL in JavaScript to a second PHP page?

I want to sent current URL from Page1 to a php page called upload_picture.php.
I look at another question and this is an option:
On Page1
$.ajax({
type: 'POST',
url: '/uas_tools/visualization_generator/V2/Resources/PHP/upload_picture.php',
data: 'url=' + window.location.toString()
});
If using this option, on upload_picture.php, how to get the URL sent from Page1?
Your code to call the ajax will be as this.
$.ajax({
type: 'POST',
url: '/uas_tools/visualization_generator/V2/Resources/PHP/upload_picture.php',
data: { url: location.href },
success: function(response) {
// your success callback
},
error: function () {
// your error callback
}
});
And on the php page you can retrieve the data as
<?php
$page_url = $_POST['url'];

How to intercept POST data with Javascript

I am using this javascript function to send data to my php script (via POST) I am then using this information to retrieve data from my database and I would like to reuse the information retrieved in my JavaScript code.
Here is my code :
$(document).on("click", "#validerChoixDeCours", function() {
jQuery.ajax({
type: "POST",
url: 'myFunctions.php',
dataType: 'json',
data: {
functionname: 'proposePA',
arguments: clickedButtons
},
success: function() {
// HERE I would like to inctercept the data that my php script put in myFunctions.php produces and use it to generate content;
}
});
});
So basically, when clicking on the button #validerChoixDeCours, my code sends some data to myFunctions.php which generates a response stored in a php variable and I want to use that response in my JS code.
Thank you in advance for your help :)
Its actually quite easy!
$(document).on("click", "#validerChoixDeCours", function() {
jQuery.ajax({
type: "POST",
url: 'myFunctions.php',
dataType: 'json',
data: {
functionname: 'proposePA',
arguments: clickedButtons
},
success: function(e) {
e contains the response from the php script
}
});
});
The first parameter of success contains the response from the request. so, in this case, the 'e' variable contains the output which you can use.
Add data variable
$(document).on("click", "#validerChoixDeCours", function() {
jQuery.ajax({
type: "POST",
url: 'myFunctions.php',
dataType: 'json',
data: {
functionname: 'proposePA',
arguments: clickedButtons
},
success: function(data) {
alert(data);
}
});
});
make sure your server side code look like this
<?php
$output = "Any String or Array";
echo json_encode($output);
?>

Display page only if ajax call succeeds?

I have a subdomain protected by a service similar to cloudflare. It checks if a visitor is human or not. To save bandwidth usage I want only one file to be loaded from this subdomain as indicator if the visitor is a bot or not. If it is not loaded, the service has blocked it as bot, and nothing should be shown.
I already thought of an ajax request before the page loads to check this.
var success = 0;
function myCall() {
var request = $.ajax({
url: "sub.example.com/hello.php",
type: "GET",
dataType: "html"
});
request.done(function() {
// Load page, because the request was successfull
$.ajax({
url: 'content.php', //This is the current file
type: "POST",
dataType:'json', // add json datatype to get json
data: ({load: true}),
success: function(data){
console.log(data);
}
})
});
Is there a better way to do this?
You may try this:
var success = 0;
function myCall() {
var request = $.ajax({
url: "sub.example.com/hello.php",
type: "GET",
dataType: "html",
success: function(){
$.ajax({
url: 'content.php', //This is the current file
type: "POST",
data: dat,
success: function(data){
console.log(data);
},
error: function(data){
console.log('Error!');
}
});
},
error: function(data){
console.log('Error!');
}
});
}

Send data from a javascript ajax function to a jsp

This is what I am trying to do. On a home page.. say /home.jsp, a user clicks on a link. I read value of the link and on the basis of which I call a RESTful resource which in turn manipulates database and returns a response. Interaction with REST as expected happens with use of JavaScript. I have been able to get information from REST resource but now I want to send that data to another JSP.. say /info.jsp. I am unable to do this.
I was trying to make another ajax call within success function of parent Ajax call but nothing is happening. For example:
function dealInfo(aparameter){
var requestData = {
"dataType": "json",
"type" : "GET",
"url" : REST resource URL+aparameter,
};
var request = $.ajax(requestData);
request.success(function(data){
alert(something from data); //this is a success
//I cannot get into the below AJAX call
$.ajax({
"type": "post",
"url": "info.jsp"
success: function(data){
alert("here");
("#someDiv").html(data[0].deviceModel);
}
});
How do I go about achieving this? Should I use some other approach rather than two Ajax calls? Any help is appreciated. Thank You.
You can use the following function:
function dealInfo(aparameter) {
$.ajax({
url: 'thePage.jsp',
type: "GET",
cache: false,
dataType: 'json',
data: {'aparameter': aparameter},
success: function (data) {
alert(data); //or you can use console.log(data);
$.ajax({
url: 'info.jsp',
type: "POST",
cache: false,
data: {'oldValorFromFirstAjaxCall': data},
success: function (info) {
alert(info); //or you can use console.log(info);
$("#someDiv").html(info);
}
});
}
});
}
Or make the AJAX call synchronous:
function dealInfo(aparameter) {
var request = $.ajax({
async: false, //It's very important
cache: false,
url: 'thePage.jsp',
type: "GET",
dataType: 'json',
data: {'aparameter': aparameter}
}).responseText;
$.ajax({
url: 'info.jsp',
type: "POST",
cache: false,
data: {'oldValorFromFirstAjaxCall': request},
success: function (info) {
alert(info); //or you can use console.log(info);
$("#someDiv").html(info);
}
});
}
In this way I'm using.
"type": "post" instead of type: 'post'
Maybe it will help. Try it please. For Example;
$.ajax({
url: "yourURL",
type: 'GET',
data: form_data,
success: function (data) {
...
}
});

trying to put an ajax request inside the success call back of another ajax request

I am trying to make two jQuery ajax calls, the second should be made from the success callback of the first. I have tried a couple variations of code e.g just messing with the brackets.
Here is what I tried.
$.ajax({
url: 'inc/grab_talk.php?name='+encoded_name+'&loc='+encoded_address+'&lat='+encoded_lat,
type: 'post',
success: function () {
$.ajax({
url: 'inc/talk_results.php',
type: 'post',
success: function (dat) {
alert(dat);
}
});
}
});
I am receiving '500 (internal server error) in console
Try this, you can use either POST or GET, but in your case GET seems to be more appropriate.
$.ajax({
type: "GET",
url: "some.php",
data: { name: "somename", location: "somelocation" },
success: function(){
$.ajax({
type: "GET",
url: "someother.php",
success: function(){
alert('test');
}
});
}
});
Check this example
$.ajax({
type: "post",
url: "ajax/example.php",
data: 'page='+btn_page,
success: function(data){
$.ajax({
var a=data; //edit data here
type: "post",
url: "example.php",
data: 'page='+a,
success: function(data){
});
});

Categories

Resources