jquery - from - getJSON síncrono

jquery json example

Question

OBJETIVO: Lo que busco es obtener datos de la base de datos y actualizar main.php (más evidente a través de draw_polygon) cada vez que se agrega algo en la base de datos (después de $ .ajax a submit_to_db.php).

Así que, básicamente, tengo un main.php que ajax llamará a otro php para recibir un array que se guardará en la base de datos, y un json llamará a otro php para devolver un array que será utilizado por 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);
         });
    }
 });

En mi caso, lo que hice fue una get_from_db función get_from_db para que getJSON realmente obtuviera datos de la base de datos, con los datos que se usarían para draw_polygon . ¿Pero es así como se debe hacer? Soy un novato y esta es la primera vez que intento con getJSON y ajax para ser honesto. Entonces mi pregunta: ¿Cómo funciona realmente el trabajo asíncrono? ¿Hay get_from_db otra solución para esto en lugar de tener que llamar a la función get_from_db con getJSON (no es síncrono, ¿es por eso que no actualiza la página cuando no está dentro de una función?) Todo el tiempo, como $.ajax con async: false (no pude hacer que funcione por cierto). Mi enfoque está funcionando, pero pensé que tal vez hay otras formas mejores de hacerlo. Me encantaría aprender cómo. Gracias por adelantado. Espero que tenga algún sentido.

Para hacerlo más claro, esto es lo que quiero lograr:

1. @start of page, obtener datos de la base de datos (actualmente a través de getJSON )
2. Pintar o dibujar en canvas utilizando los data
3. Cuando hago clic en el botón hecho actualizará la base de datos
4. Quiero AUTOMÁTICAMENTE obtener los datos nuevamente para volver a pintar los cambios en el lienzo.

Answer 1

$ .getJSON (), no acepta una configuración, como dice en los documentos, es una versión abreviada de:

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

Así que solo reescriba su solicitud en términos de eso y async: false funcionará como espera.

Answer 2

Asincrónicamente significa que la Solicitud se está ejecutando en segundo plano, y llama a su función cuando recibió una respuesta. Este método es mejor si desea obtener un resultado pero permite usar su aplicación dentro de la solicitud. Si desea tener una respuesta directa, eche un vistazo a una solicitud de sincronización. esta solicitud pausará la ejecución del script hasta que obtenga una respuesta, y el usuario no podrá hacer nada hasta que la respuesta haya sido recibida. Puedes cambiarlo a través de:

async: false,

Así por ejemplo:

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

Answer 3

Como $ .getJSON () usa configuraciones ajax, simplemente configure las configuraciones globales de 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
});

Answer 4

$.getJSON() es una notación abreviada para $.ajax() que se puede configurar para que sea sincrónica (ver jQuery.getJSON y JQuery.ajax ):

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

Trate de evitar llamadas sincrónicas sin embargo. Cita de JQuery.ajax :

Solicitudes de dominio cruzado y tipo de datos: las solicitudes "jsonp" no admiten la operación síncrona. Tenga en cuenta que las solicitudes sincrónicas pueden bloquear temporalmente el navegador, deshabilitando cualquier acción mientras la solicitud está activa.

Es posible que desee probar jQuery Deferreds esta manera:

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