Создание выпадающего списка select на основе первого выбранного выпадающего списка в DJango/Ajax

Я хочу создать выпадающий select, основанный на первом выбранном выпадающем списке, используя Ajax/JQuery с Django

Я уже сделал пару тестов, но пока безуспешно:

Модели:

class MaintenanceEquipment(models.Model):
    equip_id = models.CharField(max_length=30, auto_created=False, primary_key=True)
    line_nm = models.CharField(max_length=20, blank=True, null = True)
    sequence = models.CharField(max_length=30, blank=True, null = True)
    equip_model = models.CharField(max_length=30, blank=True, null = True)

    def __str__(self):
    return self.equip_id

просмотров:

from django.shortcuts import render
from maintenance.models import MaintenanceEquipment

def maintenanceIssueView(request):
    equipment_list = MaintenanceEquipment.objects.all()    
    context = {'equipment_list':equipment_list}
    return render(request, 'maintenance/maintenanceIssue.html', context)

def load_equipment(request):
    if request.method == 'GET':
        line = request.GET.get('line_nm')       
        equipment = MaintenanceEquipment.objects.filter(line_nm=line)      
        context = {'equipment': equipment}
        return render(request, 'maintenance/maintenanceIssue.html', context)

maintenanceIssue.html:

<form method="POST" id="maintenanceForm" data-equipment-url="{% url 'ajax_load_equipment' %}" novalidate>
{% csrf_token %}      
<div style="text-align:left;" class="container-fluid">    
   <div style="text-align:left;" class="form-row">
    <div class="form-group col-md-6">
        <label for="line_nm" style="font-size:medium;">Line</label>
        <select class="form-control" id="line_nm" name="line_nm" >
            {% for instance in equipment_list %}
            <option id="{{ instance.line_nm }}" value="{{ instance.line_nm }}">{{ instance.line_nm }}</option>
            {% endfor %}
        </select>
    </div>      
   <div class="form-group col-md-6">
        <label for="equip_sequence" style="font-size:medium;">Machine</label>
        <select class="form-control" id="equip_sequence" name="equip_sequence">
            {% for instance in equipment %}
            <option id="{{ instance.equip_id }}" value="{{ instance.sequence }}">{{ instance.sequence }}</option>
            {% endfor %}
        </select>
    </div>
</div>
</div>
</form>

<script>
   $("#line_nm").change(function () {
      var url = $("#maintenanceForm").attr("data-equipment-url"); 
      var lineID = $(this).val(); 
      
      $.ajax({                    
        url: url,                 
        data: {
          'line_nm': lineID      
        },
        success: function (data) {  
          $("#sequence").html(data); 
        }
      });
    });
</script>

В результате, line_nm был вызван ajax в мое представление load_equipment, но не возвращается во второй выпадающий список select: equip_sequence, он кажется пустым

success: function(data){  
    alert(data); 
},
error: function(XMLHttpRequest, textStatus, errorThrown) { 
    alert("Status: " + textStatus); alert("Error: " + errorThrown); 
}