我正在寻找wtforms的SelectField和Textfield之间的混合物，可以在其中输入一个字符串，该字符串可以从给定的选项列表中进行验证并自动完成，例如SearchField中的choice参数。
当前，我具有此实现，这只是一个下拉菜单，但是我希望用户能够键入任何字符串。输入字符串时，所有匹配的选项都应显示在下拉列表中，例如google搜索栏中。
possible_names = {0:'hans', 1:'sepp, 3:'max'}
class ReusableForm(Form):
name = SelectField("Enter a Name",
choices=[(uuid, name) for uuid, name in possible_names.items()],
validators=[validators.InputRequired()])
Select2 JQuery library可能就是您想要的。不幸的是，在Flask本身中无法实现您的目标。需要JS。
possible_names = {'0': 'hans', '1': 'sepp', '3': 'max'} # options should be str so that empty choice option is valid
class ReusableForm(Form):
name = SelectField("Enter a Name",
choices=[("", "")] + [(uuid, name) for uuid, name in possible_names.items()], # [("", "")] is needed for a placeholder
validators=[validators.InputRequired()])
模板：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
</head>
<body>
<form method="POST">
{{ form.hidden_tag() }}
<div style="width: 220px">
{{ form.name }}
</div>
<button>Submit</button>
</form>
<script>
$(document).ready(function() {
$('#name').select2({ // init Select2 on form's name field
placeholder: "{{ form.name.label.text }}",
allowClear: true,
"width": "style"
});
});
</script>
</body>
</html>