Question

我正在尝试在我的p：datatable上将图标显示为filterOptions。目前的情况是我显示了一个unicode符号列表，但是客户希望它们变得丰富多彩。下面的代码显示了我如何填充我的backbean中的状态列表（我的过滤器选项）。

private static final String LABEL_DEACTIVATED = "\u24E7";
private static final String LABEL_ACTIVATED = "\u2714";
private void fillSelectItem() {
        userStates = new SelectItem[3];

        userStates[0] = new SelectItem("", LABEL_ALL);
        userStates[1] = new SelectItem(USER_ACTIVATED.name(), LABEL_ACTIVATED);
        userStates[2] = new SelectItem(USER_DEACTIVATED.name(),
                LABEL_DEACTIVATED);
    }

Answer 1

只要您的目标浏览器支持CSS2属性选择器（即几乎所有现代浏览器），您就可以使用CSS来设置每个图标的样式。将以下内容放在css文件中：

option[value='USER_ACTIVATED'] {
    /* for example */
    background-image: url(.....);
    background-color: #123456;   
    color: #123123;
}

option[value='USER_DEACTIVATED'] {
    /* for example */
    background-image: url(.....);
    background-color: #888111;   
    color: #222222;
}

在p：列过滤选项中显示图标

1 个答案: