Javascript 通过单击“外部”隐藏面板时,强制选择高亮显示的p:autoComplete项
我的自动完成有问题(bug?) MyFaces 2.2.9和PrimeFaces 5.1 下面这只是一个重现我的错误的例子。我在模态对话框中有一个自动完成框Javascript 通过单击“外部”隐藏面板时,强制选择高亮显示的p:autoComplete项,javascript,jsf,primefaces,autocomplete,Javascript,Jsf,Primefaces,Autocomplete,我的自动完成有问题(bug?) MyFaces 2.2.9和PrimeFaces 5.1 下面这只是一个重现我的错误的例子。我在模态对话框中有一个自动完成框 案例1:我在autocomplete中的列表中键入一些内容并选择“hello” 并提交。Converter获取我的个人id并搜索合适的人, 一切正常 案例2(错误1):我键入“h”并在模式区域中单击h 停留并关闭列表。(当我提交表格时,h只会消失,不会 但我认为h应该消失,因为力 选择 案例3(错误2):另一个错误更难。当我输入“你好”时
公共对象getaObject(FacesContext arg0,UIComponent arg1,String arg2){
arg2不是来自hello的ID,而是字符串“hello”。只有字符串
我的预期行为应该是出现我的id。只有当我使用正常选择时,id才会出现
希望你能帮助我。
谢谢您的时间:)
问题:这是错误还是我的误解
XHTML:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>test</title>
</h:head>
<h:body>
<h:form onkeypress="return event.keyCode != 13">
<p:commandButton value="show Dialog"
oncomplete="PF('dgl').show()"
update=":dglform"/>
</h:form>
<p:dialog widgetVar="dgl" modal="true" resizable="false">
<h:form id="dglform" onkeypress="return event.keyCode != 13">
<p:autoComplete id="auto"
forceSelection="true"
converter="personConverter"
value="#{myController.selectedPerson}"
var="per"
itemLabel="#{per.name}"
itemValue="#{per}"
completeMethod="#{myController.search}">
</p:autoComplete>
<p:commandButton value="test" update="@form" />
</h:form>
</p:dialog>
</h:body>
</html>
控制器:
@ManagedBean
@ViewScoped
public final class MyController implements Serializable {
private static final long serialVersionUID = 1L;
private Person selectedPerson;
private List<Person> persons;
@PostConstruct
public void init() {
persons = new ArrayList<Person>();
persons.add(new Person(1, "hello"));
persons.add(new Person(2, "hello2"));
}
public void selectListener(SelectEvent event){
System.out.println("SELECT!");
}
public Person getSelectedPerson() {
return selectedPerson;
}
public void setSelectedPerson(Person selectedPerson) {
this.selectedPerson = selectedPerson;
}
public List<Person> search(String qry) {
return persons;
}
}
@ManagedBean
@视域
公共最终类MyController实现了可序列化{
私有静态最终长serialVersionUID=1L;
私人选择的人;
私人名单人员;
@施工后
公共void init(){
persons=newarraylist();
添加(新的人(1,“你好”);
添加(新的人员(2,“hello2”);
}
public void selectListener(SelectEvent事件){
System.out.println(“选择!”);
}
公众人物getSelectedPerson(){
返回所选人员;
}
公共无效设置selectedPerson(Person selectedPerson){
this.selectedPerson=selectedPerson;
}
公共列表搜索(字符串qry){
返回人员;
}
}
这不一定是PrimeFaces中的错误,但可能是在使用forceSelection=“true”
的情况下出现的疏忽。您可能会在某种程度上期待在输入中按Tab键时出现相同的行为
你最好向PF的家伙们报告这一点。同时,假设PrimeFaces 5.1,你可以自己解决这一问题:
/resources/primefaces/autocomplete/autocomplete.js
if
块之间插入以下代码:
if ($this.cfg.forceSelection) {
$this.items.filter('.ui-state-highlight').click();
}
这将强制在使用forceSelection=“true”
时自动选择突出显示的项目autocomplete.js
加载到
(而不是
!)的顶部,如下所示:
<h:outputScript library="primefaces" name="autocomplete/autocomplete.js" target="head" />
这确实有点麻烦,但由于这些函数是私有的,因此无法从外部轻松重写。另外,附加另一个侦听器也无法工作,因为它在以前的任何侦听器上显式执行
$.off()
。我没有看到任何可以称为“意外”或“错误”的内容。您列出的这三个案例都能正常工作。现在的问题是什么?1)“我在自动完成和提交中键入一些内容并从列表中选择“hello”。转换器获取我的个人id并搜索正确的人,一切正常。”-没什么可说的。2)“但我认为h应该因为强制选择而消失?”-是的。3)“当我提交表单时,我在转换器中得到“hello”并返回“null”,因为他只搜索ID。”-这与自动完成无关。继续。这取决于如何使用标量值(字符串到对象转换)在getAsObject()
中构造Person
的实例并通过getAsString()
(对象到字符串的转换)将其返回反过来,当你显示时。我认为有误解;)…案例2和案例3不符合预期。案例2:当我在模态区域中单击时,h不会消失,当我在表单中单击某个位置时,h会保持不变。案例3:当在“自动完成”框中键入一个单词,然后在模态区域中单击时,该单词会保持不变,并在我的转换器与案例1不同。当我直接在框中选择某个对象时,我确实得到了所描述的行为。对于#2,您只需添加required=“true”requiredMessage=“请选择现有人员”“
或更直观一些。对于#3,我不确定您明确表示转换器返回null的目的是什么,但不清楚这是否只是为了演示而省略“不相关”代码的一部分,还是因为您的实际问题(但为什么您在问题中明确指出这一点?)明白了。我重现了你的问题。这确实是与
相关的JavaScript中的一个错误。我还没有检查它的JS,但我的印象是,实际值仅在单击事件期间设置,而不是在模糊事件期间设置,因此修复方法相当简单:在模糊事件上也附加相同的侦听器,或者至少在隐藏事件上附加相同的侦听器如果有的话,菜单上的nt。
<h:outputScript library="primefaces" name="autocomplete/autocomplete.js" target="head" />