web-dev-qa-db-fra.com

getJSON Synchronous

OBJECTIF: Ce que je recherche, c'est obtenir des données de la base de données et actualiser main.php (plus évident à travers draw_polygon) chaque fois que quelque chose est ajouté dans la base de données (après $ .ajax à submit_to_db.php).

Donc, fondamentalement, j'ai un main.php qui ajax appellera un autre php pour recevoir un tableau qui sera enregistré dans la base de données, et un json appellera un autre php pour retourner un tableau sera utilisé par main.php.

$(document).ready(function() {
    get_from_db();
    $('#button_cancel').click(function(){
       $.ajax({
          url: 'submit_to_db.php',
          type: 'POST',
          data: {list_item: selected_from_list},

          success: function(result){
             ...
             get_from_db();
          }
       });
    });
    function get_from_db(){
         $.getJSON('get_from_db.php', function(data) {
             ...
             draw_polygon(data);
         });
    }
 });

Dans mon cas, ce que j'ai fait était un get_from_db appel de fonction pour getJSON pour obtenir réellement les données de la base de données, avec les données à utiliser pour draw_polygon. Mais est-ce ainsi que cela devrait être fait? Je suis un débutant complet et c'est ma première fois d'essayer getJSON et ajax aussi pour être honnête. Donc ma question: comment fonctionne réellement asynchrone? Existe-t-il une autre solution pour cela au lieu d'avoir à appeler la fonction get_from_db avec getJSON (ce n'est pas synchrone, n'est-ce pas? est-ce pour cela qu'il ne met pas à jour la page quand il n'est pas dans une fonction?) Tout le temps - comme $.ajax avec async: false (Je n'ai pas pu le faire fonctionner d'ailleurs). Mon approche fonctionne, mais j'ai pensé qu'il y avait peut-être d'autres meilleures façons de le faire. J'adorerais apprendre comment. Merci d'avance. J'espère que j'ai du sens.

Pour le rendre plus clair, voici ce que je veux réaliser:

  1. @start de la page, obtenir les données de la base de données (actuellement via getJSON)
  2. Peignez ou dessinez dans canvas à l'aide de data
  3. Lorsque je clique sur le bouton terminé, la base de données sera mise à jour
  4. Je veux obtenir de nouveau AUTOMATIQUEMENT les données pour repeindre les modifications dans le canevas.
jqueryajaxsyncgetjsonsynchronous
35
Fred

Asynchrone signifie que la demande s'exécute en arrière-plan et rappelle votre fonction lorsqu'elle a reçu une réponse. Cette méthode est préférable si vous souhaitez obtenir un résultat mais autorisez l'utilisation de votre application dans la demande. Si vous souhaitez avoir une réponse directe, jetez un œil à une demande de synchronisation. cette demande suspendra l'exécution du script jusqu'à ce qu'elle reçoive une réponse, et l'utilisateur ne peut rien faire tant que la réponse n'a pas été reçue. Vous pouvez le basculer via:

async: false,

Ainsi, par exemple:

$.ajax({
    url: "myurl",
    async: false,
    ...
})
21
tobspr

Puisque $ .getJSON () utilise des configurations ajax, définissez simplement les configurations globales ajax:

// Set the global configs to synchronous 
$.ajaxSetup({
    async: false
});

// Your $.getJSON() request is now synchronous...

// Set the global configs back to asynchronous 
$.ajaxSetup({
    async: true
});
47
cchristelis

$ .getJSON (), n'accepte pas de configuration, comme il est dit dans les documents, c'est une version abrégée de:

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

Il vous suffit donc de réécrire votre demande en termes de cela et async: false fonctionnera comme vous l'attendez.

19
Robert Moskal

$.getJSON() est une notation abrégée pour $.ajax() qui peut être configurée pour être synchrone (voir jQuery.getJSON et JQuery.ajax ) :

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  async: false, 
  success: function(data) {
      ...
      draw_polygon(data);
  }
});

Essayez cependant d'éviter les appels synchrones . Citation de doc jQuery (voir prop async) :

Requêtes inter-domaines et dataType: les requêtes "jsonp" ne prennent pas en charge le fonctionnement synchrone. Notez que les demandes synchrones peuvent verrouiller temporairement le navigateur, désactivant toutes les actions pendant que la demande est active.

Vous voudrez peut-être essayer jQuery Deferreds comme ceci:

var jqxhr = $.getJSON(url);
jqxhr.done(function(data) {
    ...
    draw_polygon(data);
});
10
R. Oosterholt