Confirmation before deleting Row

, ,
1

Hi,

On an AsyncTable I have a RemoveRowButton to which I would like the user to confirm its action before proceeding.

Is there a way to add a listener to this Button so I can call a function before the action and returning false would stop it from deleting the row?

The RemoveRowButton does not have Client-Side Events and using a CustomScript For that control has no effect.

2

You’ll have to replace the onClick handler for the RemoveRow button.


//get the remove Button Model
var button = CAF.model("jsf:defaultForm:zzz1:__rowid0:removeRowButton");

//store the current onclick
var _onclick = button.element.onclick;

//create your custom onClick
button.element.onclick = function() {
    //todo add your validation function
    //delegate to the original onclick
    _onclick();
};

Hope this helps.
Regards,
–mark

3

Is it possible to use something like

var button = CAF.model(‘#{caf:cid(“removeRowButton”)}’);

Otherwise, the code will have to get all rows’ id and loop to change every existing buttons (which will change on every page’s refresh).

4

In every row, you probably have a remove row button, correct?

If so, just add a ScriptBlock in every row, and in the script block you’ll have javascript like the sample above, but dynamically looking up each row:

//get the remove Button Model 
var button = CAF.model("#{caf:cid('removeRowButton')}"); 

//store the current onclick 
var _onclick = button.element.onclick; 

//create your custom onClick 
button.element.onclick = function() { 
    //todo add your validation function 
    alert("hello");
    //delegate to the original onclick 
    _onclick(); 
};
5

Hello,

Following your suggestion I have inserted a Script Block inside a Remove Row Icon in the row with the following code:

//get the remove Button Model   
var button = CAF.model("#{caf:cid('defaultForm:removeRowIcon')}");   
  
//store the current onclick   
var _onclick = button.element.onclick;   
  
//custom onClick
//based on the result of the confirm() dialog.
button.element.onclick = function() {   
    if (confirm("really delete?")) _onclick(); else return(false);
};

This way the row is not deleted if Cancel is pressed.

Best Regards,
Gerardo Lisboa

6

Nice!