I have two js files. These are the simplified version (there is a lot of code actually)
ucyg.js
This file is included in a page ucyg.php
- this page is loaded into my index.php
with an Ajax call. its code is
var Ucyg = function(){
var load = function() {
return $.get('Ajax/listado_ucyg.php', {
// some get parameters
}).done(function(data) {
// some DOM manipulation with Data
});
};
return {
load: load
}
};
$(document).ready(function() {
var ucyg = new Ucyg();
ucyg.load();
});
So my ajax call return ucyg.php
with this file included (to clarify: the file ucyg.js is not loaded in my browser until the ajax call of ucyg.php
in my index.php
returns), and when its ready, it does another ajax call to bring listado_ucyg.php
the other one
item.js
in some part of the code I need something very similar to what I have in ucyg.php, but with some modifications. So I thought in bring ucyg.php
as ajax call, and after that, make the modifications needed. Just like this:
$.ajax({
type: 'post',
url: 'Ajax/ucyg.php',
success: function(data){
popUpUcyg(data, fila);
},
error: handleError
});
var popUpUcyg = function(data, fila){
var a = $('#someid');
a.html(data);
// some dom manipulations (*)
}
the problem is that some of the DOM manipulations I should do is in the html code that the inner ajax call (listado_ucyg.php
) returns.
So when I do a.html(data)
, the data is rendered, the .js run its ready section and make the ajax call for listado_ucyg.php
, but I have to wait until it returns, in order to make the lasts modifications I need
How can I wait until this last ajax call is done? If its posible, I would like not to modify ucyg.js
I know I could put a timeout, but also I would like to avoid this.
In the server side I'm using PHP 5.3, in case anyone think in a option like passing a parameter to the server and do some magic
EDIT:
to clarify the sequence:
From index.php I can load any page with an ajax call - i.e. ucyg.php File ucyg.php has <script src="../Js/ucyg.js"></script>
This ucyg.js
got the code that you can see above.
In some point, from index.php I load item.php, and this page has <script src="../Js/tareas.js"></script>
. In some point, this page (After a click event) needs to load something very similar to what I have in ucyg.php
, you can see the code above. Instead of make another page, I chose to bring ucyg.php
with an Ajax call, and make some modifications with js. The problem is that when I bring ucyg.php, it includes the file ucyg.js (as we said), and this file, when its ready, make another ajax call.
Some of the modifitations I need to do, is in the data that this last ajax call does. So I need in someway to wait until this last one returns.
How can I achieve that?
Thanks
One approach might be to use ajaxComplete()
$( document ).ajaxComplete(function( event, xhr, settings ) {
if ( settings.url === "Ajax/listado_ucyg.php" ) {
/* run DOM code from items.js*/
}
});
Could also use this to resolve promises that connect to the ajax calls in item.js
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments