超过 300 行的下拉列表的最佳解决方案? [英] Best solution for a drop down list with over 300 rows?

问题描述

我有这个问题，在一个表单中，我有一个可能超过 300 的客户列表，对我来说，在那里查找并不是很简单，因为我应该滚动所有结果以查找一行！

在旧技术上，我有一个按钮可以打开一个弹出窗口，我应该研究我应该选择哪个客户，然后我使用 javascript 来记录第一个表单上的选择，但这可能是新技术的一个很好的解决方案！

我该如何解决这个疑问?大 标签的最佳解决方案是什么?

解决方案

您基本上需要一个自动完成下拉列表.这在标准 JSF 组件集中不存在，并且在标准 JSF 组件集之上使用 JavaScript/jQuery 实现也不是很简单，因为可用值必须存在于服务器端的状态中.您基本上还需要一个由

• 表示的下拉列表，而不是 因为普通的 不允许最终用户输入文本.标准 JSF 组件集没有呈现所需 HTML 标记的组件.您基本上需要创建一个自定义 JSF 组件.

  有 3rd 方 JSF 组件库已经提供了一个完整的 JSF 自动完成下拉列表.使用它们中的任何一个都会更容易，而不是通过自定义 JSF 组件重新发明轮子.随心所欲:

  • PrimeFaces - 组件
  • RichFaces - 组件
  • OpenFaces - 组件
  • ICEfaces - 组件

  I have this problem, in a form I have a list of customers that could be more than 300 and, for me, it isn't very simple find over there because I should scroll all results for find a single row!

  On the old technology I had a button that opened a pop up where I should research which customer I should select and than I used a javascript for recording the selection on the first form, but It could be a good solution with new technology!

  How can I resolve this doubt? What is the best solution for big <select> tag?

  解决方案

  You basically want an autocomplete dropdown list. This does not exist in the standard JSF component set and it is also not exactly trivial to implement with JavaScript/jQuery on top of the standard JSF component set because the available values have to be present in the server side's state. You also basically want a dropdown list which is represented by a <div><input><ul><li> instead of a <select><option> because a normal <select> doesn't allow the enduser to type text in. The standard JSF component set does not have a component which renders the desired HTML markup. You'd basically need to create a custom JSF component.

  There are 3rd party JSF component libraries which already offer a fullworthy JSF autocomplete dropdown list. It would be easier to use either of them instead of reinventing the wheel by a custom JSF component. Take your pick:

  • PrimeFaces - the <p:autoComplete> component
  • RichFaces - the <rich:autocomplete> component
  • OpenFaces - the <o:suggestionField> component
  • ICEfaces - the <ice:selectInputText> component

  这篇关于超过 300 行的下拉列表的最佳解决方案?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！