Получение данных из базы данных в Modal в Django

этот файл serivces.html содержит код, используемый для генерации элементов карточки с id, отличными от iddb

{% block content%}
<div class="container-fluid p-lg-5  d-flex justify-content-lg-around   flex-wrap ">
  {% for package in packages %}
  <div class="card" style="width: 18rem; ">
    <div>

      <img class="cardimg" src="{% static '/images/genomic lab final logo1 ( RGB ).png'%}" class="card-img-top" alt="...">
    </div>
    <div class="card-body">
      <h3 class="text-center">{{package.package_name}}  <span class="checkup text-center">Checkup</span></h3>

      <button type="button" class="modalbtn btn btn-primary" data-bs-toggle="modal" data-bs-target="#cardModal">
        more details
       </button>
    </div>
  </div>

 

  
  {% endfor%}
</div>


<<!-- Modal -->
<div class="modal fade content-data" id="cardModal"  data-url="{%url 'Services_data'%}"  tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">{{details.pkg_name}}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <H4>{{details.content}}</H4>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>
{% endblock %}

это view.py содержать

def services(request):

    packages = Packages.objects.all()
    context = {'packages':packages}

    return render(request, 'base/Services.html',context)

class AjaxHandlerView(View):
    def get(self,request,*args, **kwargs):
        if request.is_ajax():
            details = Details.object.all()
            details_serializers = serializers.serializer('json',details)
            return JsonResponse(details_serializers,safe=False)
        return JsonResponse({'message':'Errrorr'})

а это base.js содержит код ajax

$(document).ready(function(){
    $(".modalbtn").on('click',function(){
      $.ajax({
        url: "{% url 'Services_data' %}",
        type:'GET',
        datatype: 'json',
        success: function(){
          $('#cardModal').modal("show");

        },
        error:function()
          {console.log('Errorrrr');
        }
        
        });
  
      });

   
      });

По сути, этот код генерирует карточки с разными id и при нажатии на кнопку подробнее внутри определенной карточки должно быть показано модальное "всплывающее окно", содержащее подробную информацию о карточке

но у меня ничего нет внутри всплывающего окна есть предложения ??

   success: function(data) {
       $('#cardModal').HTML();
       $('#cardModal').modal("show");
    }