通过Django模板中的选择选项检索多个值



我正在使用python(3.6)&django(1.10),需要从下拉选项选择中多个值。

这是我尝试的:来自模板:

<select id="slc" name="cluster">
<option value="{{cluster.name}}#{{cluster.zone}}"> {{ cluster.name }}</option>
</select>

来自Views.py:

    def post(self, request, *args, **kwargs):
      if request.method == 'POST':
         post_data = request.POST.copy()
         form = forms.ClusterForm(post_data)
         if form.is_valid():
            project = form.cleaned_data['project']
            blocks = request.POST.get('cluster').split('#')

如何获得名称&amp; amp; amp; amp; amp; amp;区域。我已经深入研究了现有问题,但无法解决我的问题。

请帮助我!预先感谢!

首先更改模板代码:

<select id="slc" name="cluster">
<option value="{{cluster.name}}"> {{ cluster.name }}</option>
</select>

然后在视图中:

post_data = request.POST.copy()
cluster_object = Clustermodel.objects.get(name=post_data['cluster'])
post_data['name'] = cluster_object.name
post_data['zone'] = cluster_object.zone
form = forms.ClusterForm(post_data)

我们在这里做的是,我们首先从帖子发送群集的名称(最好是ID),然后在视图中获取群集对象,检索名称和区域,然后将其包含在post_data中,最后将其传递给格式。

建议将群集的 id作为值发送和获取群集对象。

<option value="{{cluster.id}}"></option>

您可以使用 javaScript 进行操作,但不要使用Django表单提交,它将始终将value标签的CC_3属性发送到您的视图。

<select id="slc" name="cluster">
   <option value="{{cluster.id}}" c-name="{{cluster.name}}" c-zone="{{cluster.zone}}" > {{ cluster.name }}</option>
</select>
<script>
    $(function() {
        $("#slc").change(function(){
            var selected_option = $('option:selected', this);
            var cluster_name = selected_option.attr('c-name');
            var cluster_zone = selected_option.attr('c-zone');
        });
    });
</script>

更新

$("#slc").change(function() {
  var selected_option = $('option:selected', this);
  var cluster_name = selected_option.attr('c-name');
  console.log("cluster_name:", cluster_name);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<body>
  <select id="slc">
      <option c-name="volvo" value="1">Volvo</option>
      <option c-name="saab" value="2">Saab</option>
      <option c-name="opel" value="3">Opel</option>
      <option c-name="audi" value="4">Audi</option>
    </select>
</body>
</html>

最新更新