Django цепочка выпадающих окон с помощью ajax

Надеюсь, у вас все хорошо, Я реализовал зависимый/цепочечный список выпадающих элементов для выпадающих элементов и он работал правильно, но когда я добавляю третий, он не работает до перезагрузки страницы. вот моя попытка :

вот HTML код и ajax скрипт:

  <form method="post" id="studentForm" data-branches-url="{% url 'ajax_load_branches' %}" novalidate>
    {% csrf_token %}
    <table>
      
      {{ form.as_table }}
    </table>
    <button type="submit">Save</button>
    <a href="{% url 'student_changelist' %}">NevermiNnd</a>
  </form>

  
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<script>
    $("#id_college").change(function () {
      var url = $("#studentForm").attr("data-branches-url");  
      var collegeId = $(this).val();  

      $.ajax({                      
        url: url,                    
        data: {
          'college': collegeId       
        },
        success: function (data) {  
          $("#id_branch").html(data);  
        }
      });

    });
    $("#id_branch").change(function () {
      var url = $("#studentForm").attr("data-reds-url");  
      var branchId = $(this).val();  

      $.ajax({                      
        url: url,                    
        data: {
          'branch': branchId       
        },
        success: function (data) {  
          $("#id_red").html(data);  
        }
      });

    });
  </script>

form.py

class StudentForm(forms.ModelForm):
    class Meta:
        model = Student
        fields = ('name', 'birthdate', 'college','branch','red')

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.fields['branch'].queryset = Branch.objects.none()
        self.fields['red'].queryset = Red.objects.none()

        if 'college' in self.data:
            try:
                college_id = int(self.data.get('college'))
                self.fields['branch'].queryset = Branch.objects.filter(college_id=college_id).order_by('name')
            except (ValueError, TypeError):
                pass  # invalid input from the client; ignore and fallback to empty City queryset
        if self.instance.pk:
            self.fields['branch'].queryset = self.instance.college.branch_set.order_by('name')
  
        if 'branch'in self.data:
            try:
                branch_id = int(self.data.get('branch'))
                self.fields['red'].queryset = Red.objects.filter(branch_id=branch_id).order_by('name')
            except (ValueError, TypeError):
                pass  # invalid input from the client; ignore and fallback to empty City queryset
        elif self.instance.pk:
            self.fields['red'].queryset = self.instance.college.branch.red_set.order_by('name')  

Я с нетерпением жду вашей поддержки. Большое спасибо.

Вернуться на верх