Confirmation Box Widget

The Confirmation Box Widget is bundled with XWiki Standard and it displays a stylized pop-up box asking the user to confirm a given action.

As you can see in the source code, the Confirmation Box widget is built on top of the Modal Popup class.

Usage

new XWiki.widgets.ConfirmationBox(behavior, interactionParameters);

XWiki.widgets.ConfirmationBox Constructor Parameters

behavior

behavior is an optional object that defines the "confirm" and "cancel" handlers. When the user confirms an action, the existing onYes method is triggered. Otherwise, the existing onNo method is triggered. In case the behavior parameter is empty, nothing will happen upon confirmation and cancel.

interactionParameters

interactionParameters is an object that defines the text elements displayed within the confirmation box:

  • confirmationText - a message about the action to confirm. The default value for English is "Are you sure?"
  • yesButtonText - the text displayed by the "Yes" button
  • yesButtonText - the text displayed by the "No" button
  • showCancelButton - a flag stating whether to display the "Cancel" button. It defaults to false
  • cancelButtonText - the text displayed by the "Cancel" button

Example

Create a wiki page and add a link to it that will trigger the deletion of a space:

{{velocity}}
{{html}}
<a href="#" id="deleteLink">Delete this space</a>
{{/html}}
{{/velocity}}

Next, add an "XWiki.JavaScriptExtension" object with the following code:

// listen to xwiki:dom:loaded to make sure we have XWiki.widgets.ConfirmationBox
document.observe('xwiki:dom:loaded', function() {
 // add onclick listener on element with id 'deleteLink'
 $('deleteLink').observe('click', function(){
   // this is called when click on element with id deleteLink happens
   // init behavior
   var behavior = {
     onYes: function() {
        alert("You have successfully deleted the space.");
      }
    };
   // init interactionParameters
   var interactionParameters = {
     confirmationText: "Are you sure you want to delete this space?",
     yesButtonText: "Yes, I confirm",
     noButtonText: "No, cancel that"
    };
   // instantiate XWiki.widgets.ConfirmationBox
   new XWiki.widgets.ConfirmationBox(behavior, interactionParameters);
  });
});

The result should be:

ConfirmationBoxLink.png

If you click the link, a pop-up with the confirmation message and the button text defined by interactionParameters will appear:

ConfirmationBox.png

In case you decide to confirm the action, you will see a new pop-up with the message defined by the behavior parameter.

ActionConfirmed.png

 

Related Pages

Search this space

 

Most popular tags

Failed to execute the [groovy] macro
  1. access rights
  2. activity stream
  3. annotation
  4. attachment
  5. comment
  6. Document Tree Macro
  7. export
  8. Extension Manager
  9. Flamingo skin
  10. global user
  11. Groovy event listener
  12. group
  13. nested page
  14. search
  15. skin
  16. syntax
  17. user
  18. user profile
  19. velocity macros
  20. wiki
  21. wysiwyg
  22. XWiki Applications
  23. xwikiattachment_archive table
  24. xwikiattachment table
  25. xwikiattrecyclebin table
  26. xwikiproperties table

[Display all tags from this space]