Menu
I need to add a button to the title bar of a Wicket modal window. I can't find anything useful in the Wicket API that will help me. Is there any way to customize the title bar in this way?
203
You can achieve such kind of effect with help of CSS. Create your custom modal window (in case you wont to create your custom style) and specify css resource.
package org.ru5.test;
import org.apache.wicket.ResourceReference;
import org.apache.wicket.extensions.ajax.markup.html.modal.ModalWindow;
import org.apache.wicket.markup.html.CSSPackageResource;
import org.apache.wicket.markup.html.resources.CompressedResourceReference;
import org.apache.wicket.model.IModel;
public class CustomModalWindow extends ModalWindow {
private static final long serialVersionUID = 1L;
private static ResourceReference CSS = new CompressedResourceReference(
CustomModalWindow.class, "res/custom-modal.css");
/**
* Creates a new modal window component.
*
* @param id
* Id of component
*/
public CustomModalWindow(final String id) {
super(id);
init();
}
/**
* Creates a new modal window component.
*
* @param id
* Id of component
* @param model
* Model
*/
public CustomModalWindow(final String id, final IModel<?> model) {
super(id, model);
init();
}
private void init() {
add(CSSPackageResource.getHeaderContribution(CSS));
}
}
/org/ru5/test/CustomModalWindow.html
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.apache.org">
<body><wicket:panel><div wicket:id="content"></div></wicket:panel></body>
</html>
Everything you need:
/org/ru5/test/res/custom-modal.css
.headBtn{position: absolute; z-index: 20001; top: 2px; left: 200px;}
/org/ru5/test/TestPanelForTestWindow.html
....
<div class="headBtn">
<input type="button" value="ok">
</div>
....
You can try to override modal.js function or just make a trick with help of JS DOM. Hope this would help.
185
According /org/apache/wicket/extension/ajax/markup/html/modal/res/modal.js you can't modify modal window decorator by wicket api because modal window markup defined entirely in javascript. So as always you can select simple but bad way and replace modal.js by your own, or you can hardly true way changing modal window after show using js to modify span with class "w_captionText". Or may be (i'm not test it) you may define you customized code in Caption property and tell to wicket to not escape special html char's in this Caption. May be it helps.
38
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
