Appeler une fonction une après l'autre
Bonjour à tous,
Quand je clique sur un boutton trois fonction vont être appelée.
Les trois fonctionnent avec ajax. (voir plus bas).
En gros, ces fonctions sont presque les même. Grace a AJAX, elles font faire uen requete MySQL et la réponse (des données de capteurs) permettra d'afficher les résultats sous forme des graphique
https://demo.smart-idea.io/?logout=1 (authentifez-vous avec les compte demo et vous verrez le resultat pour les différentes stations.
Il se trouve que la fonction get_température() affiche un graphique toujours avant la fonction get_moisture(). Ce qui me semble dans un sens logique, car il y a moins de donnée que pour get_moisture.
Malgé peut-être mes explications pas très claire, j'aimerais faire en sorte que la deuxième fonction s'exécute que la première a terminé et dès que les valeurs sont affichées sur le graphique.
Puis dès que le deuxième a terminé, la troisième est exécutée.
Code:
1 2 3 4 5 6
|
$("#showStation a").click(function(e){
get_moisture($(this).attr("data-field"),$(this).attr("data-station"),"wm");
get_temperature($(this).attr("data-field"),$(this).attr("data-station"),"te");
get_pressionHumidity($(this).attr("data-field"),$(this).attr("data-station"),"pr");
}) |
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63
|
function get_moisture(field,station,container){
//alert(container);
var para = "field=" + field + "&station=" + station;
return $.ajax({
url: 'include/get_measures.php',
type: 'POST',
data:'type[]=8&type[]=1&y-axis-0=8&y-axis-1=1&'+para,
//data:'type[]=1&y-axis-1=1&'+para,
//data:'type[]=1&'+para, // data: { pond: pond, from: from, to: to },
cache: false,
dataType: 'json',
// xhr For testing
xhr: function () {
var xhr = $.ajaxSettings.xhr();
xhr.onprogress = function e() {
// For downloads
if (e.lengthComputable) {
console.log("Download ", e.loaded / e.total);
}
};
xhr.upload.onprogress = function (e) {
// For uploads
if (e.lengthComputable) {
$("#container-st" + station + container ).children('.chartLoading').show(1);
}
};
return xhr;
},
error: function (request, error) {
console.log("Error......263");
console.log(request.responseText);
},
success: function (data) {
if(data.length <= 0)
{
}
else
{
console.log("Moisture Success:",data);
$("#container-st" + station + container ).children('.chartLoading').hide(1);
$('#st' + station + container).remove();
$('#container-st' + station + container).append('<canvas class="canvas" id="st' + station + container + '"></canvas>');
var ctx = document.getElementById("st"+station+container).getContext('2d');
var conf_moisture = config_multiAxies(data);
mychart = new Chart(ctx, conf_moisture);
}
}
});
} |
Normalement, la deuxième fonction devrait s'exécuter quand la première à terminé, (voir 'success').
Mais alors pourquoi get_temperature affiche le graphique avant get_moisture()?
Et comment donc s'assurer que la troisième attende la deuxième, et la deuxième attende la première?
Voyez-vous?