elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Tutorial básico de Quickjs


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)  (Leído 2,182 veces)
Leguim


Desconectado Desconectado

Mensajes: 672



Ver Perfil
[Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« en: 3 Diciembre 2019, 17:04 pm »

Buenos días,

estoy teniendo problemas con un código...

voy a resaltar que cada fragmento de código esta encerrado en $(document).ready (jQuery)
Código
  1. var select_country = document.getElementById('select_country');
  2. var op_country = select_country.getElementsByTagName('option');
  3. op_country[<?php echo($_POST['select_country']); ?>].selected = true;
  4.  
  5. Change_Select_Ubication('select_country'); // Función AJAX que llama a un fichero.php
  6.  
  7. // Después va a ejecutar estos otros códigos (pero para este punto todavía no terminó de completarse la función de arriba, la idea es que ejecute esto una vez que la función de arriba se complete del todo)
  8. var select_province = document.getElementById('select_province');
  9. var op_province = select_province.getElementsByTagName('option');
  10. op_province[<?php echo($_POST['select_province']); ?>].selected = true;
  11.  
  12. Change_Select_Ubication('select_province'); // Después va a ejecutar la misma función pero con parametro diferente
  13.  

Hasta ahora lo hago con un time out pero yo se que esto no es una buena manera de hacerlo.
Código
  1.            var select_country = document.getElementById('select_country');
  2.            var op_country = select_country.getElementsByTagName('option');
  3.            op_country[<?php echo($_POST['select_country']); ?>].selected = true;
  4.  
  5.            Change_Select_Ubication('select_country');
  6.  
  7.            setTimeout(function()
  8.            {
  9.                var select_province = document.getElementById('select_province');
  10.                var op_province = select_province.getElementsByTagName('option');
  11.                op_province[<?php echo($_POST['select_province']); ?>].selected = true;
  12.  
  13.                Change_Select_Ubication('select_province');
  14.            }, 750);
  15.  

Otra cosa que se me ocurrió era:

Código
  1.            var select_country = document.getElementById('select_country');
  2.            var op_country = select_country.getElementsByTagName('option');
  3.            op_country[<?php echo($_POST['select_country']); ?>].selected = true;
  4.  
  5.            var estado = Change_Select_Ubication('select_country');
  6.  
  7.            if(estado == true)
  8.            {
  9.                 var select_province = document.getElementById('select_province');
  10.                 var op_province = select_province.getElementsByTagName('option');
  11.                 op_province[<?php echo($_POST['select_province']); ?>].selected = true;
  12.  
  13.                 Change_Select_Ubication('select_province');
  14.            }
  15.  

la función es:

Código
  1.    function Change_Select_Ubication(select)
  2.    {
  3.        var select_country = document.getElementById('select_country').value;
  4.        var select_province = document.getElementById('select_province').value;
  5.  
  6.        $.ajax({
  7.            url: 'ajax/x.php',
  8.            type: 'POST',
  9.            dataType: 'html',
  10.            data: {select, select_country, select_province},
  11.  
  12.            success: function()
  13.            {
  14.                $(document).ready(function()
  15.                {
  16.                    return true;
  17.                });
  18.            }
  19.        })
  20.  
  21.        .done(function(results)
  22.        {
  23.            $('body').append(results);
  24.        })
  25.    }
  26.  

Pero tampoco funciona ya que al momento de ejecutar la función lo que va a recibir esa variable va a ser "undefined" o en el caso de que ponga una variable más arriba con un valor = false y más abajo en la parte success la cambie por true y luego en la parte de abajo (abajo de todo) return variable; va a devolver false...

ya que al momento de asignarle el valor a esa variable no se completo la función lo que es igual a nada...

¿Alguna manera?


En línea

EdePC
Moderador Global
***
Desconectado Desconectado

Mensajes: 1.749



Ver Perfil
Re: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« Respuesta #1 en: 4 Diciembre 2019, 01:27 am »

Saludos,

- Veo que sigues haciendo abuso del uso de $(document).ready(function(){...}); que abreviado y más utilizado en jQuery es: $(function(){...});

- Este es un evento sobre la carga de la página, no deberías de andar poniéndolo en en todo sitio XD, con uno solo en la página principal y ya. Si modificas la página sin recargarla (Ajax) el evento no se ejecuta.

- Tu jQuery Ajax tiene especificado una configuración success: y luego tiene un callback .done, estos se ejecutan cuando Ajax a tenido éxito, solo deberías de usar uno de ellos.

- Ten en cuenta que success: o .done se ejecutan cuando el Ajax tiene éxito, es decir, esto es lo que estás buscando y preguntando. Llama a la función o código que se deba ejecutar justo ahí, dicha función o código se ejecutará luego de haber finalizado exitosamente el Ajax.


En línea

Agente Naranja


Desconectado Desconectado

Mensajes: 530


uguu~


Ver Perfil WWW
Re: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« Respuesta #2 en: 5 Diciembre 2019, 07:46 am »

Es posible que puedas resolver tu problema usando Promesas:

https://developer.mozilla.org/en-US/docs/Web/javascript/Reference/Global_Objects/Promise

Por ejemplo:


Código:
function Change_Select_Ubication(parametro) {
  return new Promise((resolve, reject) => {
    $.ajax('https://httpbin.org/get')
    .then(() => {
      console.log(parametro);
      resolve(100);
    })
  });
};

Change_Select_Ubication('Primero')
.then(
  function () {
    Change_Select_Ubication('Segundo');
  }
);

Basicamente lo que haces es que en tu función regresas una Promise, es un objeto que te permite esperar hasta que llamas la función "resolve" y al llamar esta función le estás diciendo "Ya terminé, con éxito". A esta promesa le puedes encadenar llamadas "then()" que se ejecutan solamente cuando la promesa finaliza con éxito.
« Última modificación: 5 Diciembre 2019, 08:17 am por Agente Naranja » En línea

Leguim


Desconectado Desconectado

Mensajes: 672



Ver Perfil
Re: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« Respuesta #3 en: 5 Diciembre 2019, 21:02 pm »

Es posible que puedas resolver tu problema usando Promesas:

https://developer.mozilla.org/en-US/docs/Web/javascript/Reference/Global_Objects/Promise

Por ejemplo:


Código:
function Change_Select_Ubication(parametro) {
  return new Promise((resolve, reject) => {
    $.ajax('https://httpbin.org/get')
    .then(() => {
      console.log(parametro);
      resolve(100);
    })
  });
};

Change_Select_Ubication('Primero')
.then(
  function () {
    Change_Select_Ubication('Segundo');
  }
);

Basicamente lo que haces es que en tu función regresas una Promise, es un objeto que te permite esperar hasta que llamas la función "resolve" y al llamar esta función le estás diciendo "Ya terminé, con éxito". A esta promesa le puedes encadenar llamadas "then()" que se ejecutan solamente cuando la promesa finaliza con éxito.


¡Hola!

¿Para que sirve "https://httpbin.org/get"?  adentro hay

Código
  1. {
  2.  "args": {},
  3.  "headers": {
  4.    "Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3",
  5.    "Accept-Encoding": "gzip, deflate, br",
  6.    "Accept-Language": "es-419,es;q=0.9",
  7.    "Host": "httpbin.org",
  8.    "Sec-Fetch-Mode": "navigate",
  9.    "Sec-Fetch-Site": "none",
  10.    "Upgrade-Insecure-Requests": "1",
  11.    "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36"
  12.  },
  13.  "origin": "181.224.191.126, 181.224.191.126",
  14.  "url": "https://httpbin.org/get"
  15. }
  16.  

¿Para que serviría esto? Cuando me desocupe voy a probar el código que me pasaste y te digo... Muchas gracias!
En línea

Leguim


Desconectado Desconectado

Mensajes: 672



Ver Perfil
Re: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« Respuesta #4 en: 7 Diciembre 2019, 03:26 am »

Es posible que puedas resolver tu problema usando Promesas:

https://developer.mozilla.org/en-US/docs/Web/javascript/Reference/Global_Objects/Promise

Por ejemplo:


Código:
function Change_Select_Ubication(parametro) {
  return new Promise((resolve, reject) => {
    $.ajax('https://httpbin.org/get')
    .then(() => {
      console.log(parametro);
      resolve(100);
    })
  });
};

Change_Select_Ubication('Primero')
.then(
  function () {
    Change_Select_Ubication('Segundo');
  }
);

Basicamente lo que haces es que en tu función regresas una Promise, es un objeto que te permite esperar hasta que llamas la función "resolve" y al llamar esta función le estás diciendo "Ya terminé, con éxito". A esta promesa le puedes encadenar llamadas "then()" que se ejecutan solamente cuando la promesa finaliza con éxito.


Logré solucionarlo gracias a tu código,

¡Muchas gracias, después de tanto ya pude hacerlo!  ;-)
En línea

Agente Naranja


Desconectado Desconectado

Mensajes: 530


uguu~


Ver Perfil WWW
Re: [Pregunta]: Ejecutar función después de que se termine de completar otra (JS)
« Respuesta #5 en: 7 Diciembre 2019, 12:35 pm »

Me alegro que hayas solucionado el problema, por si quieres saberlo aún, la URL que usé era solamente una API de prueba, para confirmar que el código funcionaba cuando se hacía un ajax() de verdad y no simplemente simularlo usando un setTimeout(...), lo único que hice fue buscar una api pública, la información que devuelve es solamente de ejemplo :D
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines