通过 Django 模板中的 SELECT 选项检索多个值答案

【问题标题】：Retrieve multiple values via SELECT Option in Django Templates通过 Django 模板中的 SELECT 选项检索多个值
【发布时间】：2017-12-04 04:49:28
【问题描述】：

我正在使用 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('#')

如何获取 name 和 zone 的值。我已经深入研究了现有问题，但无法解决我的问题。所以，不要请不要将此问题标记为重复问题！

请帮帮我！提前致谢！

【问题讨论】：

如果将 {{cluster.id}} 放入模板中的值会更好，然后您就可以从您的views.py中的数据库中获取集群对象。
我不需要从数据库中检索集群对象，它来自一个 API 和视图，它会再次传递给另一个 API，并且集群对象没有可用的 id 属性。
在视图类的get 方法中，从API 中检索{name: "name", zone:"zone"} 并将其添加到要在模板中呈现的上下文字典中。或者，您可以使用来自 API 调用的数据在视图本身中创建一个带有所需选项和标签的表单。在post 方法中，从表单中提取数据并将其发送到您想发送的任何地方。
我正在使用表单，请查看更新后的代码！

标签： python django html django-views

【解决方案1】：

首先将模板代码改成这样：

<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)

我们在这里所做的是，我们首先从 post 发送集群的名称（最好是 id），然后在视图中获取集群对象，检索名称和区域，并将其包含在 post_data 中，最后将其传递给 form .

【讨论】：

我需要从一个选项字段中获取多个值！
是什么意思？你能详细说明一下吗

【解决方案2】：

建议将集群的id 作为值发送，并在您的视图中获取集群对象。

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

您可以使用 javascript 来完成，但不是使用 Django 表单提交，它会始终将 <option> 标记的 value 属性发送到您的视图。

<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>

【讨论】：

我无法以这种方式获取 cluster_name 和 cluster_zone 的值。
检查我的更新部分，我添加了一个代码 sn-p，它运行良好。
嘿，@AbdulRehman，我想知道，这些答案对你有帮助吗？