# apex.server.process, AJAX Calls, Promise y Async, Await - Ejemplos prácticos

Hola amigos en este blog veremos cómo hacer llamadas Ajax consecutivas usando apex.server.process , es decir una tras otra.


Iremos de frente a los ejemplos, para ver un poco la teoría dejare algunos enlaces en la parte final, entendamos que ya tenemos un proceso ajax callback definido en nuestra página, en mi caso se llamará `apex_ajax_call `


[Demo](https://apex.oracle.com/pls/apex/f?p=32431:1020:::NO)

### Async / Await

```js

var async_fnc_1 = async function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
      }
  }
  );
}

var async_fnc_2 = async function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  //throw new Error('Something went wrong.');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
          data.xx = 'new param just in case';
          //throw new Error(' custom error');
      }
  }
  );
}

var async_fnc_3 = async function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
      }
  }
  );
}

var fncError = function(dataError){
  console.log('error on promise' + dataError);
}

async function exec_calls(){
  var result1 = await async_fnc_1(2);
  console.log('call 1: ', result1);

  var result2 = await async_fnc_2(5);
  console.log('call 2: ', result2);
  console.log('print custom result: ', result2.xx);

  var result3 = await async_fnc_3(3);
  console.log('call 3: ', result3);
}

exec_calls();

```

![ajax_async_await]


### Promise

``` js
var promise_1 = function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
      }
  }
  );
}

var promise_2 = function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  //throw new Error('Something went wrong.');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
          data.xx = 'new param just in case';
          //throw new Error(' custom error');
      }
  }
  );
}

var promise_3 = function(parameter){
  console.log('sleep for: ' + parameter + ' sec');
  return apex.server.process( "apex_ajax_call", {
    x01: parameter
  }
  , { success: function( data )  {// do something here
      }
  }
  );
}

var fncError = function(dataError){
  console.log('error on promise' + dataError);
}

promise_1(3).then(
  function(data){
    console.log('result promise 1 / ',data.message);
    return promise_2(2);
  }
  , fncError
).then(
  function(data){
    console.log('result promise 2 / ',data);
    return promise_3(1);
  }
  , fncError
).then(
  function(data){
    console.log('result promise 3 / ',data.message); 
  }
  , fncError
)

```

![ajax_promise]


### Definicion del ejemplo

![img_ajax_callback]


Código PlSql

``` sql
declare
  l_param       number := apex_application.g_x01;
begin

  DBMS_SESSION.sleep(l_param);

  apex_json.open_object;
  apex_json.write('success',true);
  apex_json.write('message','sleep: ' || l_param || ' at: '|| LOCALTIMESTAMP);
  apex_json.close_object;

exception
  when others then
    apex_json.open_object;
    apex_json.write('success',false);
    apex_json.close_object;
end;
```



#### Referencias

- [Javascript promises in apex][referencia_1]
- [Promesas, AJAX, PLSQL y Javascript][referencia_2]
- [Javascript async await][referencia_3]
- [Using apex.server.process for AJAX in Oracle APEX][referencia_4]
- [Apex.server.process][referencia_5]



[referencia_1]: https://vmorneau.me/javascript-promises-in-apex/
[referencia_2]: https://www.youtube.com/watch?v=vvZJDobsm5M
[referencia_3]: https://vmorneau.me/javascript-async-await/
[referencia_4]: https://www.youtube.com/watch?v=yyuoIcF7hPI
[referencia_5]: https://docs.oracle.com/en/database/oracle/apex/23.2/aexjs/apex.server.html#.process




[ajax_async_await]: https://github.com/Aftorres02/blog_app_examples/raw/master/post_2024/2024_ajax_async_promise/apex_async_await.gif

[ajax_promise]: https://github.com/Aftorres02/blog_app_examples/raw/master/post_2024/2024_ajax_async_promise/apex_promise_demo.gif


[img_ajax_callback]: https://github.com/Aftorres02/blog_app_examples/raw/master/post_2024/2024_ajax_async_promise/js_ajax_call.png