You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Primefaces表格行Id自增及按输入批量增删行的实现需求

解决方案:PrimeFaces DataTable 按输入数量批量调整行并实现ID自增

前端XHTML修改

调整输入框绑定与按钮逻辑,确保后端能获取输入行数并触发表格更新:

<div class="col-12 md:col-4">
    <div class="ui-inputgroup">
        <!-- 绑定输入值到后端rowCount,添加正整数验证 -->
        <p:inputText id="rowCountInput" placeholder="输入行数" 
                     value="#{dtAddRowView.rowCount}"
                     validatorMessage="请输入正整数">
            <f:validateLongRange minimum="1"/>
        </p:inputText>
        <!-- 修改process范围获取输入值,添加update刷新表格,移除前端手动加行逻辑 -->
        <p:commandButton value="调整行数量" process="@form" 
                         action="#{dtAddRowView.onAdjustRows()}" 
                         update="products1"
                         ajax="true"/>
    </div>

    <div class="card">
        <p:dataTable id="products1" widgetVar="products1" var="product" 
                     value="#{dtAddRowView.products1}" editable="true">

            <p:column headerText="Id">
                <p:cellEditor>
                    <f:facet name="output"><h:outputText value="#{product.id}" /></f:facet>
                    <f:facet name="input"><p:inputText id="modelInput" value="#{product.id}"
                                                       style="width:100%"/></f:facet>
                </p:cellEditor>
            </p:column>

            <p:column headerText="Name">
                <p:cellEditor>
                    <f:facet name="output"><h:outputText value="#{product.name}"/></f:facet>
                    <f:facet name="input"><p:inputText value="#{product.name}" style="width:100%"
                                                       label="Name"/></f:facet>
                </p:cellEditor>
            </p:column>

            <p:column headerText="Price">
                <p:cellEditor>
                    <f:facet name="output"><h:outputText value="#{product.price}"/></f:facet>
                    <f:facet name="input"><p:inputText value="#{product.price}" style="width:100%"
                                                       label="Price"/></f:facet>
                </p:cellEditor>
            </p:column>
        </p:dataTable>
    </div>
</div>

后端Java逻辑修改

调整Bean属性与方法,实现按输入数量增删行并维护ID连续自增:

import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;
import java.util.ArrayList;
import java.util.List;

public class DtAddRowView {
    private List<Product> products1;
    private int rowCount;

    // 初始化数据列表
    public DtAddRowView() {
        products1 = new ArrayList<>();
    }

    public void onAdjustRows() {
        try {
            int targetCount = rowCount;
            int currentCount = products1.size();

            // 目标行数小于当前行数:截取前N行
            if (targetCount < currentCount) {
                products1 = products1.subList(0, targetCount);
            } 
            // 目标行数大于当前行数:补充新行
            else if (targetCount > currentCount) {
                for (int i = currentCount; i < targetCount; i++) {
                    int newId = products1.isEmpty() ? 1 : products1.get(products1.size()-1).getId() + 1;
                    products1.add(new Product(newId, "New Product", 100.0));
                }
            }
            // 重置所有行ID为连续的1、2、3...
            resetRowIds();

            FacesMessage msg = new FacesMessage("表格行数已调整", "当前行数:" + targetCount);
            FacesContext.getCurrentInstance().addMessage(null, msg);
        } catch (Exception e) {
            FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_ERROR, "错误", "请输入有效的正整数");
            FacesContext.getCurrentInstance().addMessage(null, msg);
        }
    }

    // 重置ID为连续递增序列
    private void resetRowIds() {
        for (int i = 0; i < products1.size(); i++) {
            products1.get(i).setId(i + 1);
        }
    }

    // Getter & Setter
    public List<Product> getProducts1() {
        return products1;
    }

    public void setProducts1(List<Product> products1) {
        this.products1 = products1;
    }

    public int getRowCount() {
        return rowCount;
    }

    public void setRowCount(int rowCount) {
        this.rowCount = rowCount;
    }
}

// Product实体类(需包含对应Getter/Setter)
class Product {
    private int id;
    private String name;
    private double price;

    public Product(int id, String name, double price) {
        this.id = id;
        this.name = name;
        this.price = price;
    }

    public int getId() { return id; }
    public void setId(int id) { this.id = id; }
    public String getName() { return name; }
    public void setName(String name) { this.name = name; }
    public double getPrice() { return price; }
    public void setPrice(double price) { this.price = price; }
}

效果验证

  • 输入2,点击按钮后表格变为2行,ID分别为1、2
  • 输入5,表格自动补充至5行,ID从1到5连续递增
  • 输入3,表格自动删除后2行,保留前3行且ID重置为1、2、3

内容的提问来源于stack exchange,提问作者Swagnash Thor

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.14 22:50:30