当前位置: 首页 > 知识库问答 >
问题:

如何在或中使用选择多个项目?

有骏祥
2023-03-14

我有一个Facelets页面,其中包含

  1. 我该怎么做

共有3个答案

陈浩
2023-03-14

通过发送参数的一种方法

宦树
2023-03-14

在下面的示例中,我使用复选框选择两个或多个产品,以允许用户使用JSF 2.0在新网页上比较产品规范。

我花了很长时间才发现以下问题(当然现在完全显而易见),所以我认为对于那些试图用BalusC的代码进行分页的人来说,值得一提(BalusC的回答很好,比我想象的要简单得多)。

如果使用分页,则会在以下行中获得空指针:

if(checked.get(item.getId()))

-在上面BalusC的代码中。

这是因为只有显示的复选框才会添加到地图中(doh;slap额头)。对于那些由于分页而从不显示复选框的产品,此行将导致空指针错误,需要添加复选框以忽略这些空指针(假设页面加载时未选中所有复选框)。为了让用户勾选一个复选框,他们需要显示分页页面,这样之后所有页面都可以正常工作。

如果第一页加载时需要勾选部分或全部复选框,那么这对您没有任何帮助。。。您必须手动将其添加到地图中,以便在页面加载时正确显示。

注意:因为我使用的是JPA“数据库中的实体类”对象,所以我还需要在我的ProductTbl实体类中的id中使用@瞬态,因为默认情况下,所有变量都被JPA视为数据库中的列,除非以@瞬态为前缀。此外,我正在使用第二个链接来重置复选框,它调用clearS(),我的“提交”是一个调用compareSelectedProducts()的链接,而不是提交按钮。

完整代码如下:

在从数据库派生的'ProductTbl'Entity类中:

@Transient
private Long id;

public Long getId()
{
    return id;
}

public void setId(Long id)
{
    this.id = id;
}

在支持bean“ProductSelection”中:

private Map<Long, Boolean> checked = new HashMap<Long, Boolean>();
private String errorMessage = "";
// List of all products.
private List<ProductTbl> products;
// List of products to compare.
private List<ProductTbl> compareProducts;

// Setters and getters for above...

public String compareSelectedProducts() 
{
    // Reset selected products store.
    compareProducts = new ArrayList();

    for (ProductTbl item: products) 
    {
        // If there is a checkbox mapping for the current product then...
        if(checked.get(item.getId()) != null)
        {
           // If checkbox is ticked then...
           if (checked.get(item.getId())) 
            {
                // Add product to list of products to be compared.
                compareProducts.add(item);
            } 
        }
    }

    if(compareProducts.isEmpty())
    {
        // Error message that is displayed in the 'ErrorPage.xhtml' file.
        errorMessage = "No Products selected to compare specifications. Select two or more products by ticking the check box in the second column 'Cmpr'";
        return "process_ErrorPage";
    }

    // Rest of code to get product specification data ready to be displayed.

    return "process_CompareSelected";
}

public String clearSelections()
{
    // Untick all checkbox selections.
    checked.clear();

    return "process_MainSearchResult";
}

在JSF网页的MainSearchResult中。xhtml’:

<h:commandLink action="#{productSelection.compareSelectedProducts()}" value="Cmpr Specification Comparison Table" /> 
<h:commandLink action="#{productSelection.clearSelections()}" value="Clear Selected" />

<h:dataTable value="#{productSelection.products}" rows="#{productSelection.numberRowsToDisplay}" first="#{productSelection.rowStart}" var="item" headerClass="table-header" >
    <h:column>
       <f:facet name="header">
          <h:outputText style="font-size:12px" value="Cmpr" />
       </f:facet>
       <div style="text-align:center;" >
          <h:selectBooleanCheckbox value="#{productSelection.checked[item.id]}" />
       </div>
    </h:column>
</h:dataTable>

在“faces配置”中。xml文件:

<navigation-rule>
    <navigation-case>
        <from-outcome>process_MainSearchResult</from-outcome>
        <to-view-id>/MainSearchResult.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>
<navigation-rule>
    <navigation-case>
        <from-outcome>process_CompareSelected</from-outcome>
        <to-view-id>/CompareSelected.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>
<navigation-rule>
    <navigation-case>
        <from-outcome>process_ErrorPage</from-outcome>
        <to-view-id>/ErrorPage.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>
邬良才
2023-03-14

最好是绑定<代码>

<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectBooleanCheckbox value="#{bean.checked[item]}" />
    </h:column>
    ...
</h:dataTable>
<h:commandButton value="submit" action="#{bean.submit}" />
java prettyprint-override">public class Bean {
    private Map<Item, Boolean> checked = new HashMap<Item, Boolean>();
    private List<Item> items;

    public void submit() {
        List<Item> selectedItems = checked.entrySet().stream()
            .filter(Entry::getValue)
            .map(Entry::getKey)
            .collect(Collectors.toList());

        checked.clear(); // If necessary.

        // Now do your thing with selectedItems.
    }

    // ...
}

您会看到,映射会自动填充所有表项作为键,复选框值会自动设置为与项作为键关联的映射值。

这只需要Item#equals()Item#hashCode()按照它们的合同正确实现。

如果你不能保证这一点,那么你最好使用地图

public class Item {
    private Long id;
    // ...
}
<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectBooleanCheckbox value="#{bean.checked[item.id]}" />
    </h:column>
    ...
</h:dataTable>
<h:commandButton value="submit" action="#{bean.submit}" />
public class Bean {
    private Map<Long, Boolean> checked = new HashMap<Long, Boolean>();
    private List<Item> items;

    public void submit() {
        List<Item> selectedItems = items.stream()
            .filter(item -> checked.get(item.getId()))
            .collect(Collectors.toList());

        checked.clear(); // If necessary.

        // Now do your thing with selectedItems.
    }

    // ...
}
 类似资料:
  • 问题内容: 我想选择,,从多个选择其中有10个选项。我只想选择这三个选项。 HTML代码: selenium键代码: 我尝试使用此代码。使用此代码,我可以选择第一个选项,即“ P0_ENGLISH”。但是,选择第一个选项后,我得到一个错误: 问题答案: 要从 Multi Select 元素中选择多个 选项 ,可以使用 ActionChains 模拟 Control单击* ,如下所示: *

  • 问题内容: 我经营一个网站,用户可以在其中发布项目(例如图片)。这些项目存储在MySQL数据库中。 我想查询最后十个发布项目,但任何单个用户最多只能约束3个项目。 最好的方法是什么?我的首选解决方案是对SQL查询施加约束,以请求最后十项。但是非常欢迎有关如何设置数据库设计的想法。 提前致谢! BR 问题答案: 使用关联的子查询非常容易: 该查询假定以后添加了较大的均值 相关子查询是一个强大的工具!

  • 问题内容: 如何选择多个文件? 问题答案: 在HTML5中,您可以添加multiple属性以选择多个文件。 旧答案: 每个只能选择1个文件。如果要发送多个文件,则必须使用多个输入标签或使用Flash或Silverlight。

  • 此组件来自https://github.com/skratchdot/react-bootstrap-multiselect handleChange()函数中应该写什么?

  • 问题内容: 在SQL中,我有: 我有一个WPF应用程序。 问题答案: 编辑:添加了一个子句

  • 问题内容: 所以,我想用香草JS做的事情很简单,但是我使用的是AngularJS,我想知道如何在框架内以最佳方式做到这一点。我想在多个选择框中更新所选的选项。我不想添加或删除任何选项。这是我的HTML外观: 使用以下数组,我想以编程方式从此列表中选择/取消选择选项: 当我在范围中设置此数组时,我希望选择框取消选择不是蓝色或红色的任何内容,然后选择蓝色和红色。我在Google网上论坛上看到的标准回复