时间戳

首页 > 解决方案 > Django从相关下拉列表中显示多个值

html - Django从相关下拉列表中显示多个值

问题描述

我正在使用 Python 3.8 和 Django 3.0 并且需要多个值（音量和音量大小）才能转到相关下拉列表。我已经能够使用单个值（音量）填充相关下拉列表。我发现使用下拉菜单的帖子 从 django 下拉菜单发送多个值 并 从 Django 的下拉菜单中检索多个值，但这些不适用于依赖下拉菜单。这是我的代码：

模型.py

class ArrayVolumes(models.Model):
    array = models.ForeignKey(Array, on_delete=models.CASCADE)
    volume = models.CharField(max_length=50, default=None)
    vol_size = models.CharField(max_length=10, default=None)
    def __str__(self):
        return self.volume

视图.py

from .models import ArrayVolumes

def load_volumes(request):
    array_id = request.GET.get('array')
    vols = ArrayVolumes.objects.filter(array_id=array_id).order_by('volume')
    # vol_size = ArrayVolumes.objects.filter(array_id=array_id).value('vol_size')
    return render(request, 'pure/volume_dropdown_list_options.html', {'vols': vols})

网址.py

urlpatterns = [
 path('ajax/load-volumes/', views.load_volumes, name='ajax_load_volumes'),
]

dropdown_list_options.html

<option value="">---------</option>
{% for vol, size in vols %}
<option value="{{ vol.pk }}#{{ size }}">{{ vol.volume }} ( {{ size.vol_size }} )</option>
{% endfor %}

main.html

{% extends "base.html" %}
{% load crispy_forms_tags %}

{% block content %}

<div class="container">

{% crispy form form.helper %}
<form method="post" id=volForm data-volumes-url="{% url 'ajax_load_volumes' %}" novalidate>
<br><br>
<h4>{{ note }}</h4>
</form>
</div>

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
    $("#id_array").change(function () {
        var url = $("#volForm").attr("data-volumes-url");
        var arrayId = $(this).val();

        $.ajax({
        url: url,
        data: {
            'array': arrayId
        },
        success: function (data) {
            $("#id_volume").html(data);
        }
        });

    });
    </script>
{% endblock %}

标签： htmlpython-3.xdjangoajax

解决方案

我弄清楚了这个问题。我需要在 HTML 文件中使用和ArrayVolumes.objects循环遍历所有项目。以下是我的修改：vol.volumevol.vol_size

视图.py

def load_volumes(request):
    array_id = request.GET.get('array')
    vols = ArrayVolumes.objects.filter(array_id=array_id)
    return render(request, 'pure/volume_dropdown_list_options.html', {'vols': vols})

dropdown_list_options.html

<option value="">---------</option>
{% for vol in vols %}
<option value="{{ vol.pk }}">{{ vol.volume }} ( {{ vol.vol_size }} )</option>
{% endfor %}

推荐阅读