2015-04-02 32 views
0

有一个p:selectOneListbox约20项。前5项可以在列表中查看,然后可以滚动并选择其余项。该列表已被激活。选择一个列表项目并单击ajax删除按钮时,该项目将被删除,并选择以下项目。这工作正常。但是,当索引大于5的项目时,列表的滚动条移动到顶部并且新选择的项目不可见。该应用使用PrimeFaces 5.1。p:selectOneListbox ajax项目删除更改滚动位置顶部

我也尝试过使用Apache MyFaces 2.0 - 使用f:ajax,h:selectOneListbox和h:commandButton代替相应的p:标签。管理的bean代码保持不变。在这种情况下,它工作正常 - 滚动条不会移动到顶部(只需根据需要进行调整)。我希望Primefaces标签具有类似的行为。

JSF页面代码:

<p:selectOneListbox id="list" scrollHeight="100" 
    value="#{bean.todo}"> 
    <f:selectItems value="#{bean.data}" /> 
    <p:ajax process="@this" update="msg" 
    listener="#{bean.valueChanged}" /> 
</p:selectOneListbox> 

<br /> 
<p:commandButton value="Delete"> 
    <p:ajax process="@this" update="list msg" 
    listener="#{bean.deleteListener}"/> 
</p:commandButton> 

<br /><br /><h:outputText id="msg" value="#{bean.message}" /> 

bean代码:

package example; 

import javax.faces.bean.SessionScoped; 
import javax.faces.bean.ManagedBean; 
import java.io.Serializable; 
import java.util.List; 
import java.util.ArrayList; 
import javax.faces.event.AjaxBehaviorEvent; 
import javax.faces.component.UIOutput; 

@ManagedBean(name="bean") 
@SessionScoped 
public class TodosBean implements Serializable { 

    private List<String> data; 
    private String todo; // selected item value 
    private String msg; 

    public TodosBean() { 
     loadData(); 
     String t = data.get(0); 
     setTodo(t); // select the first item in the list 
     setMessage(t); 
    } 

    private void loadData() { 
     data = new ArrayList<>();   
     data.add("1first"); 
     data.add("2second"); 
     data.add("3third"); 
     data.add("4fourth"); 
     data.add("5fifth"); 
     data.add("6sixth"); 
     data.add("7seventh"); 
     data.add("8eighth"); 
     data.add("9ninth"); 
     data.add("10tenth"); 
    } 

    public List<String> getData() { 
     return data; 
    } 

    public void setMessage(String msg) { 
     this.msg = msg; 
    } 
    public String getMessage() { 
     return msg; 
    } 

    public String getTodo() { 
     return todo; 
    } 
    public void setTodo(String t) { 
     todo = t; 
    } 

    public void valueChanged(AjaxBehaviorEvent e) { 
     String t = (String) ((UIOutput) e.getSource()).getValue(); 
     setMessage(t + " selected."); 
    } 

    public void deleteListener(AjaxBehaviorEvent e) { 
     if (data.size() == 0) { 
      return; 
     } 
     String t = getTodo(); 
     setMessage(t + " deleted."); 
     int ix = data.indexOf(t); 
     data.remove(t); 
     // select an item 
     if (data.size() == 0) { 
      setTodo(""); 
      return; 
     } 
     if (ix == data.size()) { 
      ix = ix - 1; 
     } 
     t = data.get(ix); 
     setTodo(t); 
    } 
} 
+0

作为您的其他相关职位提示:尝试了更新的版本? – Kukeltje 2015-04-02 10:35:18

+0

感谢您的回复。我已经使用版本5.1而不是5.0。 – 2015-04-02 14:22:57

+0

在你的帖子中你说你已经在使用5.1。但它现在有用吗? – Kukeltje 2015-04-02 15:30:15

回答

0

下面是关于在p滚动到选定的行的制品:数据表。表格中的项目已排序。添加,更新或删除滚动条后,滚动到所选项目 - 所选项目可见。文章中提到的jQuery脚本也可以应用于p:selectOneListBox。

​​