为什么 BootStrap TokenField 输入未在 POST 请求中传递？答案

【问题标题】：Why BootStrap TokenField input not passed in a POST request?为什么 BootStrap TokenField 输入未在 POST 请求中传递？
【发布时间】：2018-06-15 23:34:46
【问题描述】：

我正在使用http://sliptree.github.io/bootstrap-tokenfield/ 让用户选择多个关键字并通过 Django 中的 post 请求提交。这是一段 sn-p 代码的样子：

<!DOCTYPE html>
<head>
 <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" type="text/css" rel="stylesheet">

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tokenfield/0.12.0/bootstrap-tokenfield.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tokenfield/0.12.0/css/bootstrap-tokenfield.css" />

</head>

<body>
<form action="/lol" method="POST">
 <input type="text" class="form-control" id="keyword" value="red,green,blue" />
<button class="btn btn-primary"> <span class="glyphicon glyphicon-upload" style="margin-right:5px;"></span>Submit Values</button>
</body>

<script>
    $('#keyword').tokenfield({
  autocomplete: {
    source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
    delay: 100
  },
  showAutocompleteOnFocus: true
})
</script>
</html>

假设我将输入文本中的值填写为 red green 和 blue 并点击提交。很可能，它应该向/lol 端点发出POST 请求，并在keyword= 参数下提交值。但它不起作用。

Token-Field Library 有问题吗？如何对用户输入的值进行发布请求？

【问题讨论】：

标签： javascript html twitter-bootstrap bootstrap-tokenfield

【解决方案1】：

您需要为输入元素分配一个名称属性。没有名称的表单元素不会包含在请求中。

以下将起作用，

<input type="text" class="form-control" name="keyword" id="keyword" value="red,green,blue" />

W3C 规范要求每个表单输入元素都有一个指定的名称属性。否则，将不会处理该元素。 Source

【讨论】：