如何更改wicket链接树节点的颜色？

Question

我们使用wicket LinkTree。一旦构建了树并在页面上呈现，我们就可以在应用程序中动态地向树中添加新节点。当添加新节点时，我们希望用不同的颜色(例如红色)显示新添加的节点。

我们采取的一种方法(但没有奏效)如下所示。我们扩展LinkTree类并覆盖newNodeComponent方法，如下所示。

@Override
protected Component newNodeComponent(String id, IModel<Object> model) {
    return new LinkIconPanel(id, model, TalepTreeForTTBina.this) {
        private static final long serialVersionUID = 4518741854057038753L;

        @Override
        protected void onNodeLinkClicked(Object node, BaseTree tree, AjaxRequestTarget target)
        { . . . . . . 

然后，我们向这个LinkIconPanel添加一个html属性(类)。在那之后，我们的计划是编写一个jquery函数来查看树上的那个类，然后更改显示文本的< td >(或者实际上是< span >)标记的颜色。但是，我们最终得到的标记如下所示：

< td class="myClass" . . . .>
  < wicket:panel ....>
    < table . . . >
      < tbody . . . >
        < tr . . . >
          < td . . . >
            < a ...>
              < span > my text that I want to change the color < /span >

我可以访问最外面的td标记(在上面)，但不能访问Java Wicket代码中的内部标记。所以我只是将myClass插入到来自wicket代码的最外层的td标记中，并希望在客户端处理来自jQuery端的颜色。看起来(从我的css代码中)我无法从jquery (或css)到达< table>标记，因为在它们之间有一个< wicket:panel >标记。

所以我的问题是: 1.有没有更好的方法来改变LinkTree节点的颜色? 2.如果我应该这样做，我怎么才能从css中找到< span >标记呢？我不能使用RenderBodyOnly(true)，因为我没有在代码中手动添加树节点，并且我不能访问节点(要作为节点添加的项)。LinkTree为我做到了这一点。

如果能帮上忙我会很感激的。谢谢。

Answer 1

我使用SimpleAttributeModifier修改html标记中的css，如下所示：

example.css：

span.new-yellow { background: #dadada; color: #dddd55 }

example.java：

SimpleAttributeModifier sam = new SimpleAttributeModifier("class", ".alt-yellow");
if(node.) {
    exampleComponent.add(sam);
}

也许您可以在您的节点上创建一个模型来表明它是“新的”，并在这种情况下添加SimpleAttributeModifier？

另一种选择是使用HeaderContributor按照以下方式执行某些操作：

        add(new HeaderContributor(new IHeaderContributor() {
            public void renderHead(IHeaderResponse response) {
                response.renderOnLoadJavascript("document.getElementById('" + node.getMarkupId() + "').YOUR_JAVASCRIPT_HERE");
            }
        }));

转念一想，这可能对Ajax不友好。不管怎样，只是一些想法。祝好运!

Answer 2

重写LinkIconPanel的newContentComponent方法。提供一个新的标签，但是覆盖它的onComponentTag方法，添加类属性和值。

@Override
protected Component newContentComponent(String componentId, BaseTree tree,
        IModel<?> model) 
{       
    return new Label(componentId, model)
    {
        @Override
        protected void onComponentTag(ComponentTag tag) 
        {
            tag.put("class", "colourMe");
            super.onComponentTag(tag);
        }
    };
}

这会将class属性添加到span标记中，并按如下方式呈现html：

< a >
       < span class="colourMe"> my text that I want to change the color < /span >
</ a >

不需要jquery，只需使用class属性为文本着色即可。