Question

我关注this example但我想改变它。我想在你点击特定行的任何地方时选择行，而不仅仅是某个值，所以我添加了AjaxEventBehavior。问题是选择了播放器但行的颜色仍然相同。有什么问题？

listItem.add(new AjaxEventBehavior("onclick") {

    private static final long serialVersionUID = 1L;

    @Override
    protected void onEvent(final AjaxRequestTarget target) {
        selectedPlayer = player;
        HighlitableDataItem<Player> hitem = (HighlitableDataItem<Player>) listItem;
        hitem.toggleHighlite();
    }
});

Answer 1

正如@jordeu在评论中已经指出的那样，你必须将hitem添加到AjaxRequestTarget：

target.addComponent(hitem);

将组件添加到AjaxRequestTarget会将组件的标记发送回XML响应，包括您可能对服务器端进行的所有更改以及更新的模型（这对于动态模型）。请记住在要添加到请求目标的组件上调用setOutputMarkupId(true)。 Wicket需要标记ID（HTML id属性）来知道DOM中的哪个位置替换XML响应中发送的标记。或者，用javadoc：

的话来说

应该将需要更新标记的组件添加到此组件中   目标通过AjaxRequestTarget #addComponent（Component）方法。它的身体   将在目标为时呈现并添加到信封中   在ajax响应时，在客户端进行处理和刷新   接收。

标记需要更新的组件非常重要   包含生成的标记中的id属性，该属性等于   从Component＃getMarkupId（）检索的值。这可以完成   通过在html模板中设置id属性，或使用   属性修饰符，将使用值添加属性   组件＃getMarkupId（）到标记（例如MarkupIdSetter）

另外，考虑到使用Ajax来设置元素的样式可能有点过分。如果不需要服务器交互，您可以考虑使用Javascript / jQuery为客户端设置样式（如果可用）。

Answer 2

最有效的方法是将javaScript呈现到表中。这样做你避免往返于服务器，这在这个简单的造型案例中会有点过分。

通过重写DataTable＃newRowItem并将AttributeAppender添加到RowItem来实现它：

//override this method of the DataTable class
@Override
protected Item<T> newRowItem(String id, int index, final IModel<T> model) {

    Item<T> rowItem = new Item<T>(id, index, model);
    item.add(new AttributeAppender("onclick", "$(this).addClass('selected').siblings().removeClass('selected')",
            " "));

    return rowItem;

}

在选定的＆＃39;下定义您的选择样式。你的css样式表中的选择器。

在wicket中选择时如何更改行的颜色

2 个答案: