Wicket-Bootstrap

To use Wicket-Bootstrap components in your Apache Wicket application, you must install the Bootstrap settings class. The recommended location for this is within your Application#init() method.

Standard Installation

Use the default settings by calling Bootstrap.install(this).

Custom Installation

If you need to customize the Bootstrap configuration, create a BootstrapSettings object, configure it, and pass it to the install method.

// best place to do this is in Application#init()
Bootstrap.install(this);

// if you want to customize bootstrap:
BootstrapSettings settings = new BootstrapSettings();
settings.setXXX(...);
Bootstrap.install(this, settings);

When upgrading from version 0.9.4 to 0.9.5, you must update the namespace for the Bootswatch theme provider. Use the following search and replace mapping:

• From: de.agilecoders.wicket.themes.settings.bootswatch.BootswatchThemeProvider
• To: de.agilecoders.wicket.themes.markup.html.bootswatch.BootswatchThemeProvider

de.agilecoders.wicket.themes.settings.bootswatch.BootswatchThemeProvider -> de.agilecoders.wicket.themes.markup.html.bootswatch.BootswatchThemeProvider

The extension supports two advanced modes for managing multiple confirmation dialogs:

1. singleton: true: Ensures that only one confirmation dialog is open at a time. When a new one is opened, all other existing confirmation popovers are automatically hidden. This requires a rootSelector to be defined.
2. popout: true: Allows the confirmation dialog to behave like a popout. When clicking outside the dialog area, it will automatically close. This also requires a rootSelector.

Requirement: When using singleton or popout, you must provide a rootSelector option to avoid errors in jQuery 3+ environments.

// Example of singleton mode
$('#my-element').confirmation({
  singleton: true,
  rootSelector: 'body'
});

The Bootstrap Confirmation extension (built on top of Bootstrap Popover) allows you to intercept click events to show a confirmation dialog. You can configure the dialog via a JavaScript configuration object or via data-bs- data attributes on the element.

Note: Data attributes starting with data-btn (e.g., data-btn-ok-label) are prioritized during configuration.

// Example configuration object
const config = {
  title: 'Are you sure?',
  content: 'This action cannot be undone.',
  placement: 'top',
  btnOkLabel: 'Yes, delete it',
  btnOkClass: 'btn btn-danger',
  btnCancelLabel: 'No, keep it',
  onConfirm: function() {
    console.log('Confirmed!');
  },
  onCancel: function() {
    console.log('Canceled!');
  }
};

// Usage with jQuery
$('#my-element').confirmation(config);

The confirmation dialog emits several custom events that you can listen to using jQuery. These events are useful for triggering application logic after a user interacts with the dialog.

Available Events:

• shown.bs.confirmation: Fired when the confirmation popover is shown.
• click.bs.confirmation: Fired when a button inside the popover is clicked.
• confirmed.bs.confirmation: Fired when the 'OK' (or primary) button is clicked.
• canceled.bs.confirmation: Fired when the 'Cancel' (or secondary) button is clicked.
• keyup.bs.confirmation: Fired on keyup events (used for keyboard navigation).

$('#my-element')
  .on('confirmed.bs.confirmation', function() {
    console.log('User confirmed the action');
  })
  .on('canceled.bs.confirmation', function() {
    console.log('User canceled the action');
  });