小票标签未更新/仍然不可见 [英] Wicket Label not updated / remains invisible

问题描述

我正在尝试在通过ajax交换内容Panel的WebPage上实现面包屑导航.

I am trying to implement Breadcrumb Navigation on a WebPage that exchanges a content Panel via ajax.

最终看起来像这样: Home >> Page >> Panel

It ends up looking like this: Home >> Page >> Panel

这是我的页面代码:

public MyPage() {
    super();
    contentContainer = new WebMarkupContainer("contentContainer");
    contentContainer.setOutputMarkupId(true);
    add(contentContainer);
    contentContainer.add(content = createContentPanel());   

    breadCrumbContainer = new WebMarkupContainer("breadcrumbContainer");
    breadCrumbContainer.setOutputMarkupId(true);
    add(breadCrumbContainer);   

    final AjaxLink panelLink = new AjaxLink("panelLink") {

        @Override
        public void onClick(final AjaxRequestTarget target) {
            replaceContentPanel(getOverviewPanel(), target);
        }

        @Override
        public boolean isVisible() {
            return !(content instanceof OverviewPanel);
        }
    };
    breadCrumbContainer.add(panelLink);
    panelLink.add(new Label("panelLabel", new Model<String>() {
        @Override
        public String getObject() {
            //some dynamic content for example:
            return contentPanel.getClass().getName();
        }
    }));  
}

public void replaceContentPanel(final Component replacer, final AjaxRequestTarget target) {
    content.replaceWith(replacer);
    content = replacer;
     if (target != null) {           
        target.add(contentContainer);
        target.add(breadCrumbContainer);
    }
}

主页和页面Label很简单.每当我更新WebPage的内容Panel时，都需要更新Panel的那个.我确定target.add(breadCrumbContainer);行将执行此操作.但是它是空的.标签不显示任何内容.

The Home and Page Label are easy. The one for Panel needs to be updated everytime I updated the content Panel of the WebPage. I was sure that the target.add(breadCrumbContainer); line was going to do this. However it is empty. The Label shows nothing.

我希望在写问题时能找到答案-这可能很明显-但它仍然使我难以捉摸，所以我希望有人在这里发现我的错误.

I was hoping to find the answer - which is probably obvious - while writing up the question, but it still eludes me, so I am hoping someone here spots my mistake.

推荐答案

通过Ajax播放组件的可见性时，有必要使用

When playing with a component's visibility through Ajax, it's necessary to use setOutputMarkupPlaceholderTag(true), in addition to setOutputMarkupId(true). Notice that setOutputMarkupPlaceholderTag(true) will automatically imply setOutputMarkupId(true).

这样做的原因是，当通过Ajax刷新组件(将其添加到AjaxRequestTarget)时，Wicket会在Ajax响应中返回刷新的标记，以便将其通过JS-DOM API替换. Ajax回调方法.因此，要使替换接收到的标记的JS函数正常工作，必须要引用要替换的DOM节点(HTML id属性).这就是为什么需要setOutputMarkupId(true)的原因.

The reasons to do so are that when a component gets refreshed through Ajax (adding it to the AjaxRequestTarget), Wicket returns the refreshed markup in the Ajax response, so that it will be replaced via JS-DOM API through the Ajax callback method. So, for the JS function that will replace the received markup to work, it's necessary to have a reference to the DOM node to replace (an HTML id attribute). That's why setOutputMarkupId(true) is needed.

在更改可见性时，如果组件不可见，Wicket将不会为该组件生成任何标记，这虽然很棒，但是有一个缺点.如果一个不可见的组件在随后的ajax请求中变为可见，则其标记将有效地返回到Ajax响应中.但是，由于该组件不可见，因此它甚至不存在于原始标记中，并且不可能在回调时替换DOM节点.这就是setOutputMarkupPlaceholderTag(true)方法生效的地方，将也许是不可见的组件包装在占位符标记(即<div>)中，该标记将始终使用正确的HTML id呈现.属性.

When changing visibility, if the component is non-visible, Wicket will not generate any markup for the component, which is great, but has a drawback. If an invisible component turns out to be visible in a following ajax request, its markup will be effectively returned in the Ajax response. But, since the component was not visible, it will not even exist in the original markup, and it will be impossible to replace the DOM node at callback time. That's where the setOutputMarkupPlaceholderTag(true) method enters into action, wrapping the maybe-not-visible component in a placeholder tag (i.e. a <div>), that will always be rendered with the proper HTML id attribute.

这篇关于小票标签未更新/仍然不可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！