jsf - 使用 2 个 map 或带有行和列标题的列表的 PrimeFaces 复选框网格?

标签 jsf checkbox primefaces grid-layout

我正在使用 2 个字符串映射。

  Map<String, String> offices;
  Map<String, String> services;

一张 map 包含“办公室”,一张 map 包含“提供的服务”。这些中的每一个都是动态的,因为可以添加或删除新的办公室或服务。我的问题是如何成功地说明哪些办公室支持每项服务,以及最终如何捕捉到这一点。

这是我希望的样子:

enter image description here

我的第一个问题是我不知道如何使用 PrimeFaces 或 JSF vanilla 来表示它。我一直在看不同的东西,比如数据表,但它们似乎都说明了一个单一的“标题”,而不是我需要的列和行标题。或者它们说明了如何复杂地显示数据,所有数据都来自单个列表或 map 。我需要说明 2 张 map 会聚。我相信我需要将两个 map 组合成一个中间列表,但我在摸索细节。

我的第二个问题是如何捕获返回的 bool 值?我想我需要捕获索引,但它的细节暗示了我。

编辑:代码和说明:

  private Map<String, String> offices;

  public Map<String, String> getOffices() {
  return offices;
  }

//constructor
offices.put("PV001", "Pleasantville");
offices.put("GV001", "Green Valley");

然后在 JSF/XHTML 标记中:

<p:selectManyCheckbox>
    <f:selectItems value="#{myOffices.offices.entrySet()}"
        var="entry" itemLabel="#{entry.value}" itemValue="#{entry.key}" />
</p:selectManyCheckbox>

那么我将如何像那样交叉 2 个 map 并获得相关的复选标记。通常我只会创建一个带有 bodyWork、paint、oilChange 属性的办公类,但不幸的是我需要能够动态调整这些属性的数量,这就是我使用 Map 的原因。

最佳答案

关于布局,在<ui:repeat> 的帮助下使用纯HTML .使用常规的 JSF 表组件确实不可能做到这一点。

<table>
    <thead>
        <tr>
            <th>Office</th>
            <ui:repeat value="#{bean.services.values().toArray()}" var="service">
                <th>#{service}</th>
            </ui:repeat>
        </tr>
    </thead>
    <tbody>
        <ui:repeat value="#{bean.offices.entrySet().toArray()}" var="office">
            <tr>
                <td>#{office.value}</td>
                <ui:repeat value="#{bean.services.keySet().toArray()}" var="service">
                    <td><p:selectBooleanCheckbox value="#{bean.officeServices[office.key][service]}" /></td>
                </ui:repeat>
            </tr>
        </ui:repeat>
    </tbody>
</table>

要修复外观,只需按照通常的方式添加一些 CSS。如有必要,应用与 PrimeFaces 用于其数据表/网格组件相同的 CSS 类名称,例如 ui-datatable和兄弟。

至于捕获提交的值,使用一堆 <p:selectBooleanCheckbox> Map<String, Map<String, Boolean>> 上的组件由办公室 ID 和服务 ID 键控的属性。下面是适当的 bean 的样子:

private Map<String, String> offices;
private Map<String, String> services;
private Map<String, Map<String, Boolean>> officeServices;

@PostConstruct
public void init() {
    offices = new LinkedHashMap<>();
    offices.put("o1", "office1");
    offices.put("o2", "office2");
    offices.put("o3", "office3");
    services = new LinkedHashMap<>();
    services.put("s1", "service1");
    services.put("s2", "service2");
    services.put("s3", "service3");
    officeServices = new HashMap<>();
    for (String office : offices.keySet()) {
        officeServices.put(office, new HashMap<String, Boolean>());
    }

}

public void submit() {
    for (Entry<String, Map<String, Boolean>> entry : officeServices.entrySet()) {
        String office = entry.getKey();
        Map<String, Boolean> services = entry.getValue();
        System.out.println(office + ": " + services);
    }
}

// 3 getters. No setters necessary.

<p:selectManyCheckbox>不是一个选项,因为您无法控制每个单元格的渲染。

确保您使用最新的 Mojarra。已知旧版本存在与嵌套 <ui:repeat> 相关的错误和 Ajax 。如果我是正确的,它固定在 2.1.14~2.1.17 左右。

关于jsf - 使用 2 个 map 或带有行和列标题的列表的 PrimeFaces 复选框网格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16967052/

相关文章:

javascript - 如何使用 javascript 将复选框添加到列表

jquery 复选框逻辑不起作用

java - 未调用 JSF 操作监听器

tomcat - NoClassDefFoundError (Digester) 与 Tomcat 和 MyFaces

css - 选中时无法更改 Font Awesome 图标颜色 - 复选框

ajax - 在 @ApplicationScope 的 ManagedBean 中使用 ajax 进行轮询

javascript - 如何在模态中显示 primefaces 图表?

javascript - 使用 primefaces 访问 Jquery UI

java - 如何使用 p :graphicImage with StreamedContent inside ui:repeat/h:dataTable/p:dataTable?

jsf - 如何在 PhaseListener 中 @Inject