Question

姜戈菜鸟

我目前正在尝试为汽车模型实施依赖下拉列表 - 制造商 I am following this tutorial

我的表格显示正常，但我面临的问题是如果我选择了制造商，则不会显示任何模型。

我花了很多时间试图解决这个问题，但我没有想法

欢迎所有反馈！

forms.py

from blog.models import Post, Manufactures, Models

class PostForm(ModelForm):
    class Meta:
        model = Post
        fields = 'title', 'manufacture', 'model', 'content', 'image', 'aspiration'

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.fields['model'].queryset = Models.objects.none()

models.py

    class Manufactures(models.Model):
    manufacture_id = models.AutoField(primary_key=True)
    manufacture = models.CharField(max_length=55)
        
    def __str__(self):
        return self.manufacture

    def get_absolute_url(self):
        return reverse('db-manufactures', kwargs={'pk': self.pk})


class Models(models.Model):
    model_id = models.AutoField(primary_key=True)
    model = models.CharField(max_length=55)
    model_manufacture = models.ForeignKey(Manufactures, on_delete=models.CASCADE)
    
    def __str__(self):
        return self.model

    def get_absolute_url(self):
        return reverse('blog-models', kwargs={'pk': self.pk})

视图.py

    def loadModels(request):
    manufacture_id = request.GET.get('model_manufacture')
    models = Models.objects.filter(manufacture_id = manufacture_id)
    return render(request, 'model_dropdown_list.html', {'models': models})

class PostCreateView(LoginRequiredMixin, CreateView):
    model = Post
    form_class = PostForm

    def form_valid(self, form):
        form.instance.author = self.request.user
        return super().form_valid(form)
    
    def save(self, *args, **kwargs):
        super(Post,self).save(*args, **kwargs)

model_dropdown_list.html

    <option value="">---------</option>
    {% for model in models %}
    <option value="{{ model.pk }}">{{ model.name }}</option>
    {% endfor %}

post_form.html

    {% extends "blog/base.html" %}
{% load crispy_forms_tags %}
{% block content %}
<div class="content-section">
    <form method="post" id="modelForm" data-models-url="{% url 'ajax' %}" novalidate>
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4">Create Post</legend>
            {{ form|crispy }}
        </fieldset>
        <div class="form-group">
            <button class="btn btn-outline-info" type="submit">Post</button>
        </div>
    </form>
</div>

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
    $("#id_manufacture").change(function () {
        var url = $("#PostForm").attr("data-models-url");  // get the url of the `load_cities` view
        var manufactureId = $(this).val();  // get the selected country ID from the HTML input

        $.ajax({                       // initialize an AJAX request
            url: url,                    // set the url of the request (= localhost:8000/hr/ajax/load-cities/)
            data: {
                'manufacture': manufactureID       // add the country id to the GET parameters
            },
            success: function (data) {   // `data` is the return of the `load_cities` view function
                $("#id_model").html(data);  // replace the contents of the city input with the data that came from the server
            }
        });

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

urls.py

    urlpatterns = [
    path('post/new/', PostCreateView.as_view(), name='post-create'),
    path('ajax/load-models', views.loadModels, name='ajax')
]

更新

错误在我的 post_form.html 中，我使用了小写的 d 而不是大写

<script>
$("#id_manufacture").change(function () {
    var url = $("#PostForm").attr("data-models-url");  
    var manufactureId = $(this).val(); !!!lowercase "d" on manufactureId

    $.ajax({                      
        url: url,                    
        data: {
            'manufacture_id': manufactureID !!!uppercase "D"       
        },
        success: function (data) {   
            $("#id_model").html(data);  
        }
    });

});

新问题

它似乎在进行正确的调用，并且正在获取正确的 ID，但它的行为异常。当我选择制造商时，它会运行一次请求。如果我改变主意并选择不同的制造商，它会运行两次调用（使用正确的 ID），依此类推。

除非在您选择制造商后的页面上，模型下拉列表为空

解决方案

def loadModels(request):
model_manufacture_id = request.GET.get('model_manufacture')
models = Models.objects.filter(model_manufacture_id=model_manufacture_id) #orderby?
return render(request, 'blog/model_dropdown_list.html', {'models': models})

Answer 1

这在教程中看起来很像，但我不能说 100%，因为您的 urls.py 丢失了。你检查开发者控制台了吗？尝试console.log(manufactureId)和console.log(url)检查您是否拥有所需的正确数据

还有我能看到的 -> 你的模型没有一个名为 name 的属性，它在你的 Models 类中被称为 model - 所以你需要得到 model.model 而不是 {{ 1}} 在 model.name

model_dropdown_list.html

模板必须如下所示：

class Models(models.Model):
    model_id = models.AutoField(primary_key=True)
  --> model = models.CharField(max_length=55)
    model_manufacture = models.ForeignKey(Manufactures, on_delete=models.CASCADE)
    
    def __str__(self):
        return self.model

    def get_absolute_url(self):
        return reverse('blog-models', kwargs={'pk': self.pk})

PS：我可以看到，您想使用 <option value="">---------</option> {% for model in models %} <option value="{{ model.pk }}">{{ model.model }}</option> {% endfor %} 访问您的表单，但它的 Id 是 $("#PostForm") - 请检查您的命名:)

依赖 Django 的下拉菜单无法正常运行

1 个答案: