update API response

I use an API call on my application page to return the tasks of a process, for example: Process 01 with the Tasks (Step1, Step2, Step3).

I need to create a javascript code that recognizes when a change from Step1 to Step 2 occurs. That is, when one task completes and moves on to the next. The problem is, the API always returns the outdated value from my task list. When a task is executed, the return of my API does not change automatically, I need something that does this.

Hello - when you say that the “return of my API does not change automatically”, are you talking about a “REST API extension” variable that you use in a page built using the UI Designer?

Yes, I use a “Rest APi extension” variable.

As I said above, I use an API to return information about tasks related to a process. One of the information that the API returns is the name of the task (displayName), but when the task is executed the information it should return is different.

For example:

Process 01 - Tasks (Step1, Step2, Step3)

API return

[“displayDescription”: “”, “executedBy”: “0”, “rootContainerId”: “51026”, “assigned_date”: “”, “displayName”: “Step2”, “executedBySubstitute”: “0”, "dueDate “” “” “” “” “” “” “” “” “” “” “” “” “” “” “” “” “” “” “” 51026 “,” name “:” Step2 “,” reached_state_date “:” 2018-12-11 “,” rootCaseId “:” 51026 “,” id “:” 1140126 “,” state “:” ready “,” parentCaseId " : “51026”, “last_update_date”: “2018-12-11 13:45: 32,566”, “assigned_id”: “”, “person”: “”}

I execute the Step2 task - API return is the same as the previous one.

I refresh the page - API return is updated.

My problem is that: I can not refresh the page, the information is not shown in a div, ie AJAX is not useful.
I need some method that only updates API return because I need the updated information to execute a javascript code.

Thank you for the clarification. The REST API Extension does not work like this, it basically makes the call at page load and that’s it. If you need to poll periodically I think the best is to create a dedicated custom widget with a bidirectional property.

HIH,

Thanks a lot for the help.

Could you explain me better how this “bidirectional property” works and how can I implement it? It would be a great help.

Sure, here is some literature about Custom Widget and property types .

I thought you were referring to “data binding” when you said “bi-directional ownership” - as described in these references:

https://gist.github.com/emchateau/e3057c7e76a50d895e98b6d6bd7404ac

https://stackoverflow.com/questions/45490004/2-way-data-binding-in-javascript

I could not figure out how to reach my ultimate goal through the literatures you mentioned.

Remember, briefly, I need to update an API callback. I did something related to http calls with the GET method, but I did not succeed.

I tried to do this: did not work

function update(){

var xmlhttp;
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
callback(xmlhttp.responseText);
}
};
xmlhttp.open(“GET”, “http://localhost:8080/bonita/API/bpm/task?p=0&c=10”, false);
xmlhttp.send();
var serverResponse = xmlhttp.responseText;
return serverResponse;

}

setInterval(update, 1000);

You should have a look into this contributed Custom Wigdet . An HTTP call is being done to assign the current user to the current task (in a form). It should be a great example of what you need to do to make a valid REST API call to Bonita.

HIH,