Tôi cần thêm nút vào thanh tiêu đề của cửa sổ phương thức Wicket. Tôi không thể tìm thấy bất cứ điều gì hữu ích trong API Wicket sẽ giúp tôi. Có cách nào để tùy biến thanh tiêu đề theo cách này không?Cửa sổ phương thức Wicket có thể được tùy chỉnh không?
Theo /org/apache/wicket/extension/ajax/markup/html/modal/res/modal.js bạn không thể sửa đổi trang trí cửa sổ phương thức bằng wicket api vì đánh dấu cửa sổ phương thức được xác định hoàn toàn bằng javascript. Vì vậy, như mọi khi bạn có thể chọn cách đơn giản nhưng xấu và thay thế modal.js bằng cách của riêng bạn, hoặc bạn khó có thể đúng cách thay đổi cửa sổ phương thức sau khi hiển thị bằng cách sử dụng js để sửa đổi khoảng với lớp "w_captionText". Hoặc có thể (tôi không thử nghiệm), bạn có thể xác định mã tùy chỉnh của bạn trong thuộc tính Phụ đề và nói với wicket không thoát khỏi ký tự đặc biệt của html trong Chú thích này. Có thể nó sẽ giúp.
Bạn có thể đạt được loại hiệu ứng như vậy với sự trợ giúp của CSS. Tạo cửa sổ phương thức tùy chỉnh của bạn (trong trường hợp bạn không tạo kiểu tùy chỉnh) và chỉ định tài nguyên css.
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>
Tất cả những gì bạn cần:
/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>
....
Bạn có thể cố gắng ghi đè hàm modal.js hoặc chỉ cần thực hiện một thủ thuật với sự trợ giúp của JS DOM. Hy vọng điều này sẽ hữu ích.
Bit của một hack, nhưng hoạt động:
import org.apache.wicket.extensions.ajax.markup.html.modal.ModalWindow;
import org.apache.wicket.model.IModel;
public class FixedModalWindow extends ModalWindow {
private static final long serialVersionUID = 1L;
public FixedModalWindow(String id) {
super(id);
setResizable(false);
}
public FixedModalWindow(String id, IModel<?> model) {
super(id, model);
setResizable(false);
}
@Override
public FixedModalWindow setResizable(boolean resizable) {
// Cannot set resizable on the FixedModalWindow
return this;
}
@Override
public boolean isResizable() {
return false;
}
@Override
protected Object getShowJavascript()
{
// Hack in some JS to remove the onMove handlers
StringBuffer showJS = new StringBuffer();
showJS.append(" ");
showJS.append((String) super.getShowJavascript());
showJS.append("var popupWindow = Wicket.Window.get();\n");
showJS.append("var nullHandler = function() {};\n");
showJS.append("if(popupWindow != null) {\n");
showJS.append("popupWindow.bind(popupWindow.caption, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.bottomRight, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.bottomLeft, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.bottom, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.left, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.right, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.topLeft, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.topRight, nullHandler);\n");
showJS.append("popupWindow.bind(popupWindow.top, nullHandler);\n");
showJS.append("}\n");
return showJS.toString();
}
}
Làm thế nào để ẩn nút đóng ở cửa sổ modal của bạn trong wicket? Chúng tôi đã tìm thấy một giải pháp như vậy:
ModalWindow yourModal = new ModalWindow("yourModalID") {
@Override
public void show(AjaxRequestTarget pTarget) {
super.show(pTarget);
pTarget.appendJavascript(""//
+ "var thisWindow = Wicket.Window.get();\n"//
+ "if (thisWindow) {\n"//
+ "$('.w_close').attr('style', 'display:none;');\n"//
+ "}"//
);
}
}
Trên thực tế, bạn có thể chèn bất cứ lớp từ cửa sổ phương thức, và thay đổi nó một cách nào đó. Hy vọng nó sẽ giúp ai đó :)
Hmpf ... oh well, thanks anyway. – Yuval
Nếu bạn đi một cách đơn giản. Chính xác thì bạn sẽ làm gì để ghi đè lên modal.js? –