Как показать модальное окно с изображением в Wicket

Я пытаюсь создать в Wicket модальное окно, содержащее изображение (org.apache.wicket.markup.html.image.Image). Как указано в Руководстве пользователя Wicket (https://wicket.apache.org/guide/guide/ajax.html):

Содержимым модального окна может быть либо другой компонент, либо страница.

Изображение удовлетворяет этому условию:

class Image extends WebComponent -> class WebComponent extends Component

Я попробовал это с Label (org.apache.wicket.markup.html.basic.Label), и это сработало. Когда я сделал это с изображением, я получил исключение. Вот мой код Java и HTML (logo.png находится в том же пакете, что и .java и .html):

Джава

// Modal window with Image
final ModalWindow mwImage = new ModalWindow("modalWindowWithImage");
PackageResourceReference imgRef = new PackageResourceReference(this.getClass(), "logo.png");
Image img = new Image(mwImage.getContentId(), imgRef);
mwImage.setContent(img);
add(mwImage);

add(new AjaxLink("imageLink") {
    @Override
    public void onClick(AjaxRequestTarget target) {
        mwImage.show(target);
    }
});

HTML

<a href="#" wicket:id="imageLink">image link</a>
<div wicket:id="modalWindowWithImage"></div>

Неожиданное исключение времени выполнения

Last cause: Component [content] (path = [30:modalWindowWithImage:content]) must be applied to a tag of type [img], not:  '<div wicket:id="content">' (line 0, column 0)

Вот сгенерированный HTML-код:

<a href="javascript:;" wicket:id="imageLink" id="imageLink22">image link</a>
<div wicket:id="modalWindowWithImage" id="modalWindowWithImage25" style="display:none"><wicket:panel xmlns:wicket="http://wicket.apache.org">
    <div id="content26" style="display:none"></div>
</wicket:panel></div>

Описание исключения говорит само за себя: отсутствует тег ‹img›, но я не нашел, как это решить и показать модальное окно с изображением. Я использую wicket.версия 6.17.0. Заранее спасибо.


wicket wicket-6
person vitfo    schedule 02.10.2014    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Вы можете добавить изображение только к HTML-тегу типа <img>. Вы пытаетесь добавить его в файл <div>. Точно так же вы можете добавить ссылку только к <a> html-тегам. Лучшее, что вы можете здесь сделать, это создать панель с изображением и добавить ее в свое модальное окно.

public class ImgPanel extends Panel {

    public ImgPanel(PackageResourceReference imgRef) {
        add(new Image("imgid", imgRef));
    }
}

с HTML

<html><body>
<wicket:panel>
    <img wicket:id="imgid" ... />
</wicket:panel>
</body></html>

Теперь добавьте эту панель в ваше модальное окно.

person Martin    schedule 02.10.2014