Implementing confirmation screen before deletion

Hi @ThinhDinh

I have my order tab displaying my orders.
Have implemented one touch on the orders to cancel if user wants to by means of actions.
Now I need confirmation before it’s been deleted.

How to implement css for this.

I think you can use the cancel button to:

  • Show a new screen of the current row
  • Display a message like “Are you sure you want to cancel this order? This action can not be undone.”
  • Add a button bar, the left button is “Go back” with a go back action, the right button is “Cancel” with the action you implemented originally.
2 Likes

Hi @ThinhDinh @Darren_Murphy

The right button of the button bar is not deleting the order from the table.

Left go back is working
Right action is delete row

But right action not working.

Can you go into more details on how it’s not “working”?

Generally, when you say something’s not working, you should describe or record a video so we can debug the thing with you, or at least make educated guesses.

Actually it is working.but the problem is,

I have displayed the list as descending but the order table is adding new order at the bottom.so if I delete the top order,first order in the order table in my inline list deleted.so it looks to me not working because the last order is still not deleted.

Thanks for your understanding.

Hi @ThinhDinh

The right side of the button bar takes some time to do the actions compared to the left.

Right side i have added delete row and a notification

Left side is just go back action.

This is a order table,when someone wants to cancel ,i have done this.may I know why it’s taking more time.

Possibly because the right side is a more complex action than the left. One thing you could try is to put any go back or show notification actions before the delete row.

It’s a bit counter intuitive but it’s worked for me and the app lags less on submit.

You can drag and drop actions in the editor to help rearrange quicker.

1 Like

As you are pointing that the right side is complex,i don’t think like that.before i implemented this by button bar,i implemented by a simple click this order should deleted.its worked fast,same delete row actions are used.

By using button bar,its working like this.i also implemented after delete action,next is go back action n notification also given.but there is a lag.

Delete actions is, of course, more complex than go back actions. What I would do is have a boolean column, let’s say “Deleted?”, then your action would be like this:

  • Set Deleted column to true.
  • Delete the row.
  • Go back.

Hide the rows where the deleted column is true, on the front end. That action will still delete the row afterwards, but your users are not likely to experience the lag with the first set column happening fast.

2 Likes

Hi,

Can you please help me to achieve this.

What he means is to set a filter on your front list to show only items where “Deleted” ‘is not true’, then when you use a “Set Columns” in your action to move ‘true’ to the delete column, that row will not show on your front screen even if there is a lag on the sync of all the tables.

In addition, I find that if I show an alert “Row Deleted!” before any other actions, the user will see that as confirmation that things are happening, so even if the rest of the custom action takes a bit of time, the user will have immediate visual feedback.

2 Likes

This is important. I would always show the notification last.

With actions that are slowish, what I will often do is implement some additional logic that immediately hides the button/component that has just been tapped. This usually involves using a Set Column values to toggle a user specific boolean column, and using that column in a visibility condition.

2 Likes

Still not understand what you guys are saying…can I get a visual treat of this…