My problem is very simple. I have a javascript that updates an html page everytime it gets a new ajax request. Here is the fetched php:
if (isset($_REQUEST['sowhat'])) {
$file="hello.txt";
while( !file_exists($file) ) {
sleep(1);
}
unlink($file);
$RESPONSE="ok";
echo json_encode($RESPONSE);
}
I need the javascript to send a query again every time it gets an ok response from the php. How is this achievable? I have tried with a basic infinite loop but the page crashes.
$.when($.ajax( "json_test.php?sowhat="+"kkk" )).done(function(result){
console.log(result);
console.log('done');
thisone.parent().hide("slide", { direction: "left" }, 500)
thisone.parent().prev().show("slide", { direction: "right" }, 500)
// AJAX AGAIN, FOREVER
});
Any help is greatly appreciated, thanks in advance.
Related
Client side:
io.socket.get('/measurements', {
id: id,
_csrf: csrf,
}, function (resData, jwRes) {
console.log(resData);
});
Server side:
fn: async function () {
var measurements = [];
if (!this.req.isSocket) {
//error here
} else {
// get measurements, removed this section for readibility
return this.res.status(200).json({
measurements: measurements
});
}
}
This works, it returns the measurements, but it also returns the following error:
Error: Cannot write to response more than once
I think this is because Sails is sending a 200 response after my response, but I can't figure out how to override Sails' response or append the measurements to it.
Turns out sails is smarter than I thought. By trial and errror I found that I could replace:
return this.res.status(200).json({
measurements: measurements
});
with:
return ({measurements});
And sails does the rest.
I'm using ajax to call a POST method in my controller. On average, this method runs between 15 and 20 seconds.
I'm using aync false in that call because I need to wait the answer to know which way to go. But, when i using async false my loading (gif) isn't showed.
$(document).ajaxStart(function() {
$('#overlay').show();
});
$(document).ajaxStop(function() {
$('#overlay').hide();
});
What is the best way to resolve it?
EDIT 1
I have the save function that performs multiple validations and calls the method in the controller:
function salvarInformacoes(pedidos, ums, callback) {
$.ajax({
url: 'PlanoCortes/SalvarInformacoes',
type: 'POST',
data: {
sglDeposito: $("#ddl-Deposito option:selected").text(),
codUnimetPCP: $('#ddl-Um-sip').val(),
numEtapa: $("#ddl-Operacao").val(),
rotinaUM: $('#chk-Rotina-UM').is(":checked"),
dscEtapa: $("#ddl-Operacao option:selected").text(),
dadosPedidosJson: pedidos,
dadosUMsJson: ums,
corteVirtual: corteVirtual
},
success: callback
});
}
function salvar() {
var resultado = false;
...
salvarInformacoes(JSON.stringify(pedidos), JSON.stringify(ums), myCallback);
function myCallback(retorno) {
if (retorno.success != false) {
...
}
else {
resultado = false;
return;
}
resultado = true;
}
return resultado;
}
...
Before the method "myCallback" is called, the function return false. In this way, the code inside the statement below is never executed:
if (salvar()) {
...
}
What is the best way to resolve it?
Don't use async: false.
The browser doesn't show the changes because async: false makes the operation not asynchronous and locks the browser. Keep asynchronous code asynchronous and you can do other things while that code is executing.
I need to wait the answer to know which way to go.
This is the result of a design flaw somewhere in the code. You might try looking through the question and answers here for some help. Essentially you don't want to block the client-side code while waiting for the response, but instead want to handle the response when it arrives.
After looking through the jQuery documentation and many stackexchange community forums, I am still faced with this problem. Taking little bits from here and there have helped me get this far, but I am stuck where I am now.
Im using an ajax request to try and load the next post after the one that is currently displayed. The only issue I run into is when I try to execute the method included in my php file:
<?php
echo getnext();
function getnext(){
$post = get_post($_POST['id']);
$prevPost = get_previous_post();
return $prevPost->post_content;
}
?>
I can echo the POST variable that is being passed in fine, but once I try to actually call the method I get a 500 internal Server Error.
My AJAX request looks like this:
setTimeout(function (){
$currid = $('#post_id').val();
$.post("wp-content/themes/stargazer/populate.php",
{
"id":$currid
},
function(data){
//$("#academiccontent").html(data);
alert (data);
});
$('#academiccontent').animate({ 'opacity': 1 });
}, 1000);
Any help would be greatly appreciated, Ive been stuck on this for a long while now.
Thanks!!
Why don't you use AJAX directly in WordPress?
The best way is add to function.php file in your theme something like this:
add_action( 'wp_ajax_getnext', 'getnext' );
function getnext() {
$post = get_post($_POST['id']);
$prevPost = get_previous_post();
return $prevPost->post_content;
die(); // this is required to return a proper result
}
And your javascript change to this:
setTimeout(function (){
$currid = $('#post_id').val();
var data = {
"action": "getnext",
"id":$currid
};
$.post(ajaxurl, data,
function(data){
alert (data);
});
$('#academiccontent').animate({ 'opacity': 1 });
}, 1000);
More info about AJAX in WordPress you can find here: http://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_(action)
I've got a piece of code that look like this.
app.get('/auth/facebook', function( request, response ) {
if( request.session.user ){
response.render( 'index.jade' );
} else {
request.authenticate(['facebook'], function(error, authenticated) {
if( authenticated ) {
request.session.user = request.getAuthDetails().user;
response.writeHead(303, { 'Location': "/auth/facebook" });
}
});
}
});
If there is a user in session it will render the page, if not it will get a user from Facebook and store that in a session variable and reload the page... and render it. It works perfectly fine. But I want to trigger that piece of code via AJAX and do something like this:
app.get('/auth/facebook', function( request, response ) {
response.contentType('application/json');
if( request.session.user ){
response.send(JSON.stringify({'authenticated':true}));
} else {
request.authenticate(['facebook'], function(error, authenticated) {
if( authenticated ) {
request.session.user = request.getAuthDetails().user;
response.writeHead(303, { 'Location': "/auth/facebook" });
} else {
response.send(JSON.stringify({'authenticated':false}));
}
});
}
});
But that doesn't work. It says "Can't use mutable header APIs after sent" and puts it self in an endless loop saying "Can't render headers after they are sent to the client." over and over again.
Am I going about this the wrong way? I want my server code to connect with Facebook without the need of a page reload.
I am wondering what is the best way to stop duplciate submissions when using jquery and ajax?
I come up with 2 possible ways but not sure if these are the only 2.
On Ajax start disable all buttons till request is done. 2 problems I see with this though is I use jquery model dialog so I don't know how easy it would be to disable those button as I not sure if they have id's. Second I if the the request hangs the user has really no way to try again since all the buttons are disabled.
I am looking into something called AjaxQueue at this time I have no clue if it is what I need or how it works since the site where the plugin is apparently down for maintenance.
http://docs.jquery.com/AjaxQueue
Edit
I think this is a spin off of what I was looking at.
http://www.protofunc.com/scripts/jquery/ajaxManager/
The only problem I see with this ajaxManager is that I think I have to change all my $.post, $.get and $.ajax ones to their type.
But what happens if I need a special parameter from $.ajax? Or that fact I like using .post and .get.
Edit 2
I think it can take in all $.ajax options. I am still looking into it. However what I am unsure about now is can I use the same constructor for all requests that will use the same options.
First you have to construct/configure a new Ajaxmanager
//create an ajaxmanager named someAjaxProfileName
var someManagedAjax = $.manageAjax.create('someAjaxProfileName', {
queue: true,
cacheResponse: true
});
Or do I have to make the above every single time?
How about setting a flag when the user clicks the button? You will only clear the flag when the AJAX request completes successfully (in complete, which is called after the success and error callbacks), and you will only send an AJAX request if the flag is not set.
Related to AJAX queuing there is a plugin called jQuery Message Queuing that is very good. I've used it myself.
var requestSent = false;
jQuery("#buttonID").click(function() {
if(!requestSent) {
requestSent = true;
jQuery.ajax({
url: "http://example.com",
....,
timeout: timeoutValue,
complete: function() {
...
requestSent = false;
},
});
}
});
You can set a timeout value for long-running requests (value is in milliseconds) if you think your request has a possibility of hanging. If an timeout occurs, the error callback is called, after which the complete callback gets called.
You could store an active request in a variable, then clear it when there's a response.
var request; // Stores the XMLHTTPRequest object
$('#myButton').click(function() {
if(!request) { // Only send the AJAX request if there's no current request
request = $.ajax({ // Assign the XMLHTTPRequest object to the variable
url:...,
...,
complete: function() { request = null } // Clear variable after response
});
}
});
EDIT:
One nice thing about this, is that you could cancel long running requests using abort().
var request; // Stores the XMLHTTPRequest object
var timeout; // Stores timeout reference for long running requests
$('#myButton').click(function() {
if(!request) { // Only send the AJAX request if there's no current request
request = $.ajax({ // Assign the XMLHTTPRequest object to the variable
url:...,
...,
complete: function() { timeout = request = null } // Clear variables after response
});
timeout = setTimeout( function() {
if(request) request.abort(); // abort request
}, 10000 ); // after 10 seconds
}
});
$.xhrPool = {};
$.xhrPool['hash'] = []
$.ajaxSetup({
beforeSend: function(jqXHR,settings) {
var hash = settings.url+settings.data
if ( $.xhrPool['hash'].indexOf(hash) === -1 ){
jqXHR.url = settings.url;
jqXHR.data = settings.data;
$.xhrPool['hash'].push(hash);
}else{
console.log('Duplicate request cancelled!');
jqXHR.abort();
}
},
complete: function(jqXHR,settings) {
var hash = jqXHR.url+jqXHR.data
if (index > -1) {
$.xhrPool['hash'].splice(index, 1);
}
}
});