启用行虚拟化的表中primefaces 8.0中的过滤器错误

如何解决启用行虚拟化的表中primefaces 8.0中的过滤器错误

我正在使用Primefaces 8.0。 具有冻结列和冻结部分和滚动部分中的列上的过滤器的表。行虚拟化已启用。

按钮代码:

<p:commandLink partialSubmit="true" process="@this" action="#{controller.loadCars}"  update=":form:tab1">
    <h:outputText value="Submit"/>
</p:commandLink>

表格代码:

<h:form id="form">
    <p:dataTable
        id="tab1"
        scrollable="true"
        scrollHeight="350"
        scrollWidth="900"
        frozenColumns="2"
        var="car"
        scrollRows="5"
        virtualScroll="true"
        lazy="true"
        rows="5"
        rowIndexVar="#"
        value="#{model.cars}"
        widgetVar="carsTable"
        emptyMessage="No cars found with given criteria"
        filteredValue="#{model.filteredCars}">
        <p:ajax event="filter"  />
        <p:columnGroup groupRow="true" type="frozenHeader" >
        <p:row>
            <p:column field="1" headerText="Id"  filterBy="#{car.id}" filterMatchMode="contains"  >
                <p:inputText style="width:90%;"
                            onchange="PF('carsTable').filter()"
                            onkeyup="PF('carsTable').filter()"
                            onkeypress="if (event.keyCode == 13) { return false; }">
                </p:inputText>
            </p:column>
            <p:column field="2" headerText="Color" filterBy="#{car.color}" filterMatchMode="contains" >
                <p:inputText style="width:90%;"
                            onchange="PF('carsTable').filter()"
                            onkeyup="PF('carsTable').filter()"
                            onkeypress="if (event.keyCode == 13) { return false; }">
                </p:inputText>
            </p:column>
        </p:row>
        </p:columnGroup>
        <p:columnGroup groupRow="true" type="scrollableHeader">
        <p:row>
            <p:column headerText="Id" width="100"/>
            <p:column field="4" headerText="Year" filterBy="#{car.year}" filterable="true" filterMatchMode="contains" width="100">
                <p:inputText style="width:90%;"
                            onchange="PF('carsTable').filter()"
                            onkeyup="PF('carsTable').filter()"
                            onkeypress="if (event.keyCode == 13) { return false; }">
                </p:inputText>
            </p:column>
            <p:column headerText="Brand" width="100"/>
            <p:column headerText="Color" width="100"/>
            <p:column headerText="Id" width="100"/>
            <p:column headerText="Year" width="100"/>
            <p:column headerText="Brand" width="100"/>
            <p:column headerText="Color" width="100"/>
            <p:column headerText="Id" width="100"/>
            <p:column headerText="Year" width="100"/>
            <p:column headerText="Brand" width="100"/>
            <p:column field="3" sortBy="#{car.color}" filterBy="#{car.color}" headerText="Color2" filterMatchMode="contains" width="100" >
                <p:inputText style="width:90%;"
                            onchange="PF('carsTable').filter()"
                            onkeyup="PF('carsTable').filter()"
                            onkeypress="if (event.keyCode == 13) { return false; }">
                </p:inputText>
            </p:column>
        </p:row>
        </p:columnGroup>
        <p:column headerText="Id" >
        <h:outputText value="#{car.id}"/>
        </p:column>
        <p:column headerText="Color" >
        <h:outputText value="#{car.color}" />
        </p:column>
        <p:column headerText="Id">
        <h:outputText value="#{car.id}" />
        </p:column>
        <p:column headerText="Year">
        <h:outputText value="#{car.year}" />
        </p:column>
        <p:column headerText="Brand">
        <h:outputText value="#{car.brand}" />
        </p:column>
        <p:column headerText="Color">
        <h:outputText value="#{car.color}" />
        </p:column>
        <p:column headerText="Id">
        <h:outputText value="#{car.id}" />
        </p:column>
        <p:column headerText="Year">
        <h:outputText value="#{car.year}" />
        </p:column>
        <p:column headerText="Brand">
        <h:outputText value="#{car.brand}" />
        </p:column>
        <p:column headerText="Color">
        <h:outputText value="#{car.color}" />
        </p:column>
        <p:column headerText="Id">
        <h:outputText value="#{car.id}" />
        </p:column>
        <p:column headerText="Year">
        <h:outputText value="#{car.year}" />
        </p:column>
        <p:column headerText="Brand">
        <h:outputText value="#{car.brand}" />
        </p:column>
        <p:column headerText="Color">
        <h:outputText value="#{car.color}" />
        </p:column>
        <p:column groupRow="true" headerText="Color2" >
        <h:outputText value="#{car.color}" />
        </p:column>
    </p:dataTable>
</h:form>

控制器

import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named
@RequestScoped
public class Controller implements Serializable {

    @Inject
    private Model model;


    public void loadCars(){
        model.getCars().clear();
        List<Car> tempCars = new ArrayList<>();
        for(int i = 0 ; i < 100 ; i++) {
            tempCars.add(new Car( UUID.randomUUID().toString().substring(0,8),model.getBrands().get((int)(Math.random() * 10)),String.valueOf((int)(Math.random() * 50 + 1960)),model.getColors().get((int) (Math.random() * 10)),(int) (Math.random() * 100000),(Math.random() > 0.5) ? true: false ));
        }
        model.getCars().addAll(tempCars);
    }
}

型号

import javax.enterprise.context.SessionScoped;
import javax.inject.Named;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;

import lombok.Data;

@Named
@SessionScoped
@Data
public class Model implements Serializable {

    Model(){
        colors = new ArrayList<>();
        colors.add("Black");
        colors.add("White");
        colors.add("Green");
        colors.add("Red");
        colors.add("Blue");
        colors.add("Orange");
        colors.add("Silver");
        colors.add("Yellow");
        colors.add("Brown");
        colors.add("Maroon");

        brands = new ArrayList<>();
        brands.add("BMW");
        brands.add("Mercedes");
        brands.add("Volvo");
        brands.add("Audi");
        brands.add("Renault");
        brands.add("Fiat");
        brands.add("Volkswagen");
        brands.add("Honda");
        brands.add("Jaguar");
        brands.add("Ford");
    }

    private List<Car> cars = new ArrayList<>();
    private List<Car> filteredCars;
    private List<String> colors;
    private List<String> brands;
}

对象

public class Car implements Serializable {

    public String id;
    public String brand;
    public String year;
    public String color;
    public int price;
    public boolean sold;

    public Car() {}

    public Car(String id,String brand,String year,String color) {
        this.id = id;
        this.brand = brand;
        this.year = year;
        this.color = color;
    }

    public Car(String id,String color,int price,boolean sold) {
        this.id = id;
        this.brand = brand;
        this.year = year;
        this.color = color;
        this.price = price;
        this.sold = sold;
    }

    public String getId() {
        return id;
    }
    public void setId(String id) {
        this.id = id;
    }

    public String getBrand() {
        return brand;
    }
    public void setBrand(String brand) {
        this.brand = brand;
    }

    public String getYear() {
        return year;
    }
    public void setYear(String year) {
        this.year = year;
    }

    public String getColor() {
        return color;
    }
    public void setColor(String color) {
        this.color = color;
    }

    public int getPrice() {
        return price;
    }
    public void setPrice(int price) {
        this.price = price;
    }

    public boolean isSold() {
        return sold;
    }
    public void setSold(boolean sold) {
        this.sold = sold;
    }

    @Override
    public int hashCode() {
        int hash = 7;
        hash = 59 * hash + (this.id != null ? this.id.hashCode() : 0);
        return hash;
    }

    @Override
    public boolean equals(Object obj) {
        if (obj == null) {
            return false;
        }
        if (getClass() != obj.getClass()) {
            return false;
        }
        final Car other = (Car) obj;
        if ((this.id == null) ? (other.id != null) : !this.id.equals(other.id)) {
            return false;
        }
        return true;
    }
}

如果关闭行虚拟化,则在表中进行过滤,然后一切正常。

将数据过滤到表中时,

primefaces库出现JS错误。

Uncaught TypeError: can't access property "children",b.bodyTable is undefined
    oncomplete http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    v http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    jQuery 6
    send http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    offer http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    handle http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    ab http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    filter http://localhost:8080/jsf_html4+PR8/ line 2 > injectedScript:1
    callBehavior http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:22
    filter http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    filterTimeout http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    setTimeout handler*bindFilterEvent/< http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    jQuery 2
components.js.xhtml:12:31834
    oncomplete http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    v http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    jQuery 6
    send http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    offer http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    handle http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    ab http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:18
    filter http://localhost:8080/jsf_html4+PR8/ line 2 > injectedScript:1
    callBehavior http://localhost:8080/jsf_html4+PR8/javax.faces.resource/core.js.xhtml?ln=primefaces&v=8.0:22
    filter http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    filterTimeout http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    (Асинхронный: setTimeout handler)
    bindFilterEvent http://localhost:8080/jsf_html4+PR8/javax.faces.resource/components.js.xhtml?ln=primefaces&v=8.0:12
    jQuery 2

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


依赖报错 idea导入项目后依赖报错,解决方案:https://blog.csdn.net/weixin_42420249/article/details/81191861 依赖版本报错:更换其他版本 无法下载依赖可参考:https://blog.csdn.net/weixin_42628809/a
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下 2021-12-03 13:33:33.927 ERROR 7228 [ main] o.s.b.d.LoggingFailureAnalysisReporter : *************************** APPL
错误1:gradle项目控制台输出为乱码 # 解决方案:https://blog.csdn.net/weixin_43501566/article/details/112482302 # 在gradle-wrapper.properties 添加以下内容 org.gradle.jvmargs=-Df
错误还原:在查询的过程中,传入的workType为0时,该条件不起作用 &lt;select id=&quot;xxx&quot;&gt; SELECT di.id, di.name, di.work_type, di.updated... &lt;where&gt; &lt;if test=&qu
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct redisServer’没有名为‘server_cpulist’的成员 redisSetCpuAffinity(server.server_cpulist); ^ server.c: 在函数‘hasActiveC
解决方案1 1、改项目中.idea/workspace.xml配置文件,增加dynamic.classpath参数 2、搜索PropertiesComponent,添加如下 &lt;property name=&quot;dynamic.classpath&quot; value=&quot;tru
删除根组件app.vue中的默认代码后报错:Module Error (from ./node_modules/eslint-loader/index.js): 解决方案:关闭ESlint代码检测,在项目根目录创建vue.config.js,在文件中添加 module.exports = { lin
查看spark默认的python版本 [root@master day27]# pyspark /home/software/spark-2.3.4-bin-hadoop2.7/conf/spark-env.sh: line 2: /usr/local/hadoop/bin/hadoop: No s
使用本地python环境可以成功执行 import pandas as pd import matplotlib.pyplot as plt # 设置字体 plt.rcParams[&#39;font.sans-serif&#39;] = [&#39;SimHei&#39;] # 能正确显示负号 p
错误1:Request method ‘DELETE‘ not supported 错误还原:controller层有一个接口,访问该接口时报错:Request method ‘DELETE‘ not supported 错误原因:没有接收到前端传入的参数,修改为如下 参考 错误2:cannot r
错误1:启动docker镜像时报错:Error response from daemon: driver failed programming external connectivity on endpoint quirky_allen 解决方法:重启docker -&gt; systemctl r
错误1:private field ‘xxx‘ is never assigned 按Altʾnter快捷键,选择第2项 参考:https://blog.csdn.net/shi_hong_fei_hei/article/details/88814070 错误2:启动时报错,不能找到主启动类 #
报错如下,通过源不能下载,最后警告pip需升级版本 Requirement already satisfied: pip in c:\users\ychen\appdata\local\programs\python\python310\lib\site-packages (22.0.4) Coll
错误1:maven打包报错 错误还原:使用maven打包项目时报错如下 [ERROR] Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.2.0:resources (default-resources)
错误1:服务调用时报错 服务消费者模块assess通过openFeign调用服务提供者模块hires 如下为服务提供者模块hires的控制层接口 @RestController @RequestMapping(&quot;/hires&quot;) public class FeignControl
错误1:运行项目后报如下错误 解决方案 报错2:Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.8.1:compile (default-compile) on project sb 解决方案:在pom.
参考 错误原因 过滤器或拦截器在生效时,redisTemplate还没有注入 解决方案:在注入容器时就生效 @Component //项目运行时就注入Spring容器 public class RedisBean { @Resource private RedisTemplate&lt;String
使用vite构建项目报错 C:\Users\ychen\work&gt;npm init @vitejs/app @vitejs/create-app is deprecated, use npm init vite instead C:\Users\ychen\AppData\Local\npm-