为什么BootStrap TokenField输入未在POST请求中传递?

时间:2018-06-15 23:34:46

标签: javascript html twitter-bootstrap bootstrap-tokenfield

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

<!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 greenblue并点击提交。可能,它应该向POST端点发出/lol请求,并在keyword= param下提交值。但它不起作用。

Token-Field Library是否存在问题?如何发布值用户输入的发布请求?

1 个答案:

答案 0 :(得分:1)

您需要为input元素指定name属性。没有名称的表单元素将不包含在请求中。

以下工作,

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

W3C规范要求每个表单输入元素都指定了name属性。否则,将不处理该元素。 Source