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

 

 


Tema destacado: Recopilación Tutoriales y Manuales Hacking, Seguridad, Privacidad, Hardware, etc


+  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 7,251 veces)
Leguim


Desconectado Desconectado

Mensajes: 720



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: 2.176



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: 535


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: 720



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 »
Cita de: Agente Naranja 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.


¡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: 720



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 »
Cita de: Agente Naranja 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.


Logré solucionarlo gracias a tu código,

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


Desconectado Desconectado

Mensajes: 535


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:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
problemas con ejecutar cualquier archivo y esperar a que termine
Programación Visual Basic 		yovaninu 2 2,671 Último mensaje 25 Marzo 2008, 15:07 pm
por cobein
Ejecutar un archivo externo y esperar a que termine para eliminarlo
Programación C/C++ 		ThunderCls 3 9,585 Último mensaje 11 Marzo 2012, 21:57 pm
por ThunderCls
[Pregunta]: Ejecutar Funcion JS
Desarrollo Web 		Leguim 1 1,936 Último mensaje 12 Noviembre 2018, 19:16 pm
por Drakaris
[Pregunta]: Ejecutar función PHP por medio de AJAX
Desarrollo Web 		Leguim 2 2,142 Último mensaje 14 Febrero 2019, 03:01 am
por Leguim
[Pregunta]: ¿Cómo puedo usar una función en otra función en la misma clase?
Desarrollo Web 		Leguim 0 2,654 Último mensaje 13 Junio 2020, 10:35 am
por Leguim
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines