使用 BootsFaces 实现自动完成（使用 inputText 提前输入）

Question

我在 Java EE 中开发了一个 Web 应用程序，在这个应用程序中有一个 inputText 允许根据他的名字搜索学生。但是，我遇到了一个无法找到解决方案的问题。我使用带有预输入 (Bootsfaces) 的 inputText，如果我向它发送一个 List Etudiant（我的列表对象）它会起作用，但是当我向它发送一个 List String 时，不会出现任何建议：/ 在我的控制器 (Java) 中，我 return 一个包含每个学生姓名和姓氏的列表，我希望能够显示此列表的建议。

这是我的 xHtml 代码：

<b:inputText style="width:200px" value="" placeholder="Rechercher étudiant" typeahead="true" typeahead-values="#{etudiantController.getEtudiants()}"/>

有我的控制器（etudiantController）代码：

public List<String> getEtudiants() {
    etudiants = gestionEtudiant.selectAll();
    List<String> listeNomPrenom = new ArrayList<String>();

    for(Etudiant e : etudiants) {
        listeNomPrenom.add(e.getNom() + " " + e.getPrenom());
    }

    return listeNomPrenom;
   }

希望不要打扰我的 post，提前致谢 ;)

Answer 1

所以这里有几件事要解决...

首先，您需要一个支持bean 值，以便组件具有适当的参考值。不设置 value 可能适用于自动完成，具体取决于组件的实现方式，但您将无法访问用户稍后在控制器中实际输入的内容。对于某些组件，它可能会使组件以不希望的方式运行。所以你需要将它连接到一个 bean 属性.

其次，typeahead-values 需要一个直接的字符串，或者一个 bean 属性。只有在非常特殊的情况下，您才需要调用 bean 属性的 getter - 因此您应该引用属性.

第三，不要返回新的学生列表，而是尝试在 typeahead-values 中利用 Java 内置的 toString() 功能。然后您不必创建一个全新的列表，而是可以依靠 Java 为您进行转换。

因此，模仿您正在尝试做的事情并翻译成英语的完整解决方案如下所示；

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:b="http://bootsfaces.net/ui">
    <h:head>
        <title>Autocomplete test</title>
    </h:head>
    <h:body>
        <h:form>
            <b:inputText value="#{studentBean.studentEntry}" placeholder="Search student"
                         typeahead="true" typeahead-values="#{studentBean.students}"/>
        </h:form>
    </h:body>
</html>

@Data
@Named
@ViewScoped
public class StudentBean implements Serializable {
    private List<Student> students;
    private String studentEntry;

    @PostConstruct
    public void init() {
        students = new ArrayList<>();
        students.add(new Student("Carl", "Sagan"));
        students.add(new Student("Enrico", "Fermi"));
        students.add(new Student("Jay", "Miner"));
    }

    @Data
    @AllArgsConstructor
    public class Student {
        private String firstName;
        private String lastName;

        @Override
        public String toString() {
            return String.format("%s %s", lastName, firstName);
        }
    }
}

请注意，此示例使用 Lombok - 因此 @Data 注释为属性创建了所需的设置器和 getters。

还要注意 toString() 实际上是如何翻转名字并将姓氏放在前面的就像您在代码中所做的那样。

使用 BootsFaces 实现自动完成（使用 inputText 提前输入）

Implement autocomplete (typeahead with inputText) with BootsFaces

jsf

bootsfaces