java Primefaces 数据表过滤器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15572920/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Primefaces datatable filter
提问by Deb
I've tried a few things but I could not do any work on my filter dataTable. Already follow the example of the primefaces showcase and nothing.
我已经尝试了一些东西，但我无法对我的过滤器数据表做任何工作。已经遵循了primefaces展示的例子，什么也没有。
I have the following codes:
我有以下代码：
xhtml:
html:
<p:dataTable id="dataTable" var="valor" value="#{beanMensagemXContato.listaContatoEmail}"
widgetVar="carsTable" emptyMessage="No cars found with given criteria" filteredValue="#{tableBean.filteredCars}">
<f:facet name="header">
</f:facet>
<p:column
style="max-width: 50px; min-width: 50px; overflow: hidden">
<f:facet name="header">
<h:outputText value="Contato" />
</f:facet>
<h:outputText value="#{valor.nomGrupoEmail}" />
</p:column>
<p:column
style="max-width: 50px; min-width: 50px; overflow: hidden">
<f:facet name="header">
<h:outputText value="Email" />
</f:facet>
<h:outputText value="#{valor.endEmail}" />
</p:column>
<p:column
style="max-width: 50px; min-width: 50px; overflow: hidden">
<f:facet name="header">
<h:outputText value="Telefone" />
</f:facet>
<h:outputText value="#{valor.numTelefone}" />
</p:column>
<p:column
style="max-width: 50px; min-width: 50px; overflow: hidden">
<f:facet name="header">
<h:outputText value="A??es" />
</f:facet>
</p:column>
</p:dataTable>
Bean:
豆角，扁豆：
public List<ContatoEmail> getListaContatoEmail() {
listaContatoEmail = new ArrayList<ContatoEmail>();
listaContatoEmail = consultaContatoEmail.listarContatoEmail();
return listaContatoEmail;
}
I want something that when you type a word in dataTable select the row.
我想要一些东西，当您在 dataTable 中键入一个单词时，请选择该行。
Can someone pass me a simple example.
有人可以给我一个简单的例子。
Since I already appreciate.
既然我已经欣赏了。
Debora
黛博拉
回答by maggu
Ok, here is an example: I'll take the popular example of cars.
好的，这是一个例子：我会以汽车这个流行的例子为例。
Use Case: Dynamically update a data-table upon each keystrokes in auto-complete
用例：自动完成每次击键时动态更新数据表
My Facelet:
我的脸：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view>
<h:head />
<h:body>
<h:form>
<p:autoComplete var="carac" converter="carconvertor"
value="#{testBean.selectedCar}" itemLabel="#{carac.carmodel}"
itemValue="#{carac}"
completeMethod="#{testBean.complete}" process="@this"
onSelectUpdate="idGrid">
<p:ajax event="keyup" listener="#{testBean.onValueChange}"
update="idGrid"></p:ajax>
</p:autoComplete>
<p:dataTable value="#{testBean.matchingCarModels}" var="carmatch"
id="idGrid" converter="carconvertor">
<p:column headerText="Car Model">
<h:outputText value="#{carmatch.carmodel}" />
</p:column>
</p:dataTable>
</h:form>
</h:body>
</f:view>
</html>
A Car POJO
汽车POJO
public class Car
{
private String carmodel;
public Car(String carmodel) {
super();
this.carmodel = carmodel;
}
// Add setters and getters
}
A Car Faces Convertor
车脸转换器
@FacesConverter(forClass=Car.class, value="carconvertor")
public class CarConverter
implements Converter {
@Override
public Object getAsObject(FacesContext arg0, UIComponent component, String stringvalue) {
Car car = new Car(stringvalue);
return car;
}
@Override
public String getAsString(FacesContext arg0, UIComponent component, Object objectvalue) {
Car car = (Car) objectvalue;
if(car == null) {
return StringUtils.EMPTY;
}
return car.getCarmodel();
}
}
And finally the backing bean
最后是支持豆
@ManagedBean(name="testBean")
@SessionScoped
public class TestBackingBean
{
/**
* The input filter
*/
private String filter = StringUtils.EMPTY;
/**
* Some test data
*/
private final List<Car> carModels = new ArrayList<Car>() {
{
add(new Car("toyota"));
add(new Car("honda"));
add(new Car("suzuki"));
add(new Car("ford"));
add(new Car("renault"));
add(new Car("subaru"));
}
};
/**
* For updating the grid.
*/
public void onValueChange(AjaxBehaviorEvent event)
{
AutoComplete ac = (AutoComplete) event.getSource();
Car input = (Car) ac.getValue();
filter = (input == null) ? StringUtils.EMPTY : input.getCarmodel();
}
/**
* For the auto complete drop down
*/
public List<Car> complete(String input)
{
filter = input;
return getMatchingCarModels();
}
/**
* get the match
*/
public List<Car> getMatchingCarModels()
{
if(StringUtils.isEmpty(filter))
return carModels;
List<Car> matches = new ArrayList<Car>();
for(Car car : carModels)
{
if(car.getCarmodel().startsWith(filter))
{
matches.add(car);
}
}
return matches;
}
/**
* The selected car
*/
private Car selectedCar;
//Add setters and getters for above member
}
HTH
HTH
回答by maggu
You could see the solution to the same problem in stackoverflow here
您可以在此处查看stackoverflow 中相同问题的解决方案
As an alternative approach (using auto complete) for the search and capture the keyup event to update the data table. An example tallying to your context:
作为搜索和捕获 keyup 事件以更新数据表的替代方法（使用自动完成）。符合您的上下文的示例：
<p:autoComplete var="address"
value="#{addressBean.address}" itemLabel="#{address.personName}"
itemValue="#{address}" completeMethod="#{addressBean.complete}"
process="@this" converter="personconvertor"
onSelectUpdate="dataTable">
<p:ajax event="keyup" listener="#{addressBean.onValueChange}"
update="dataTable"></p:ajax>
</p:autoComplete>
