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.


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

XWiki.widgets.ConfirmationBox Constructor Parameters


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 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


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

<a href="#" id="deleteLink">Delete this space</a>

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:


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


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



Related Pages

Trying to decide between Cloud and On Premise? See the comparison on the XWiki Help Center.

Search this space