在 django 模型属性上传递 url 参数

Question

I need to create a form with 5 select fields, each one dependent of the previous one (Schools, Disciplines, Macro-Content, Micro-Content, Teacher)

I'm able to get only one working, passing an Ajax view to the form div:

  <form action="" id="orderForm" method="POST" discipline-queries-url="{% url 'ajax-load-discipline' %}>

and

<script src="//code.jquery.com/jquery-3.6.0.js"></script>
  <script>
    $("#institute").change(function () {
        const url = $("#orderForm").attr("discipline-queries-url");
        const instituteId = $(this).val();

        $.ajax({
            url: url,
            data: {
                'institute_id': instituteId
            },
            success: function (data) { 
                $("#discipline").html(data);
            }
        });

    });
</script>

From what I understand I'd need 4 different ajax views, one for each database query, and pass the url attribute through modelform attributes like this:

            'discipline': forms.Select(attrs={'id': 'discipline', 'class': 'form-control',
                                              'discipline-queries-url': '{% url "ajax-load-discipline" %}'}),

But the special characters are escaping and returning something like this:

"GET /order/create/%7B%%20url%20%22ajax-load-discipline%22%20%%7D?institute_id=1 HTTP/1.1" 404 13568

So it is passing {% url "ajax-load-discipline" %} to the url...

Any idea of what I can do to pass the correct parameters?

Answer 1

When you set attributes for a widget, it does not get rendered as if it were part of the template, it gets rendered as if it were a variable being rendered in the template, hence instead of "{% url 'ajax-load-discipline' %}" you should be writing the url itself there using reverse_lazy [Django docs] :

from django.urls import reverse_lazy


'discipline': forms.Select(attrs={'id': 'discipline', 'class': 'form-control', 'discipline-queries-url': reverse_lazy('ajax-load-discipline')}),