How can i use setTimeout?

Q&A
1

Hi,

 

I have a form with a table, and i need to remove elements on the fly, i made a custom button that starts a javascript.

I call the query and put the response data into the tables variable. This works nicely, but of course the process is slower than the call of the query, so i need to wait before i call the query.

 I used the setTimout() function and it works, but the watcher only runs if i click on the table, so the data is loaded into the variable, but the table content only loads when i click on it.

I read that in angular JS a function like this: 

$scope.$apply();

will load into the table or:

 myApp.controller('myController', function($scope, $timeout){ // just example

  $timeout(()=>{
     $('#dtBasicExample').DataTable();
   })

 

but i dont have access to these variables in the designer it self. 

Focusing or "clicking" with jquery doesnt trigger the table to refresh.

I there a way to use timers in the designer? (that works well)

Regards:

Zoltan

2

hello,

use $timeout to wait for an API call response does not look to be the best way to manage it.

We need to found a way to implement the behavior you need using UIDesigner. Can we have more information about your page?

- Why do you need a custom button ?

- You cannot use a variable with type " External API " ?

3

hi,

As i mentioned before i have a table, the elements inside are coming from an external API variable. A want to give the users the option to delete elements from the table (the table elements are loaded with pagination), they select an element, press delete, and the process starts, and will delete this element from the database. 

This seems fine, however, if i dont force reloading the elements of the table somehow, then for the user it will look like nothing happened. That is the reason why i try to load the elements again, of course if someone could give me an advice how this is done normally, that would be the best. I know i could just redirect the user to reload the whole page, but i dont think that is a good experience for the user. 

4

Are you using a Data Table?

if yes, a workaround to reload the list could be:

- Create a variable "timeStamp" type string

- Create a variable "urlParam" type Javascript expression.  value= 

     return {"timestamp": $data.timeStamp};

- Create a variable "refreshTimeStamp" type Javascript expression.  value= 

     return function(){ $data.timeStamp = Date.now(); };

- In your data table field "API request parameters" put "urlParam"

- In your button Delete field "Target URL on success" put  "{{refreshTimeStamp()}}"

 

For a better user experience 

- The Delete button could open a confirmation modal ?

 

let me know if this is enough to solve your issue? Or if you still have async issue?

Julien

5

Unfortunately i am using the basic table widget, is data table a new table type in 7.12? Or a custom widget? I tried searching for it but could find it anywhere, the only link that came up was a question how to use it, but  could get to the actual download. 

 

Could you please show me a link where i can download this data table?

 

Edit: I found it in the documentation, and it seems like a new table type in 2021.1 (7.12), we are using 7.11.4 version, and dont have this table widget. For our project 7.12 was unusable, although even with 7.11.4 i am experiencing freezing, and slow performance, also code completion throws exception-s all the time, so i had to turn it off completly... This is not the question however :) Sorry but i cannot test this exact method, but i will try to implement it in some way.

 

Edit #2: I tried to use this method, and to me it was a surprise, that it worked. I mean i didnt thought that putting a function in the target page field would work this way. We are testing if this works in the actual envirement, and let you know if we have async problems or not.

Thank you for the advice it was helpful.

Edit #3: I tried tried to simulate a slow deleting process, and put a timer with 1 second (also tried with 1-10-100ms) and it didnt work, so i have async problems, this is the reason why i wanted to put the timer on the form, to give time for my process to delete. Even if a spinner icon is displayed for 1-2 second is better than not seeing the result (as a user).

 

Zoltan