перебирать пользователей в списке друзей по одному и тому же модалу и получать доступ к содержимому базы данных

Question

Я делаю окно чата для моего сайта.В соответствии с текущей реализацией, я перебираю текущий список друзей и тег привязки запускает модальный режим для этого конкретного пользователя.Модал является общим для всех пользователей, так как он изменяет только данные внутри.Теперь я использовал jquery для извлечения истории сообщений (из объекта модели), а отображение - это модальное тело.Я могу нажимать на разных пользователей и правильно просматривать сообщения в их моделях.Однако, когда я пытаюсь отправить форму для отправки другого сообщения, она добавляется в окно сообщения первого пользователя.Это происходит для всех пользователей в списке друзей.

Как мне вызвать форму для публикации в модели правильного пользователя.

Шаблон

<code>{% for friend in friends_list %}
                <a href=""  data-toggle="modal" data-target="#chatbox" data-whatever="{{friend.to_user}}"><li style="padding:10px">{{friend.to_user.usercreation.fname}}  {{friend.to_user.usercreation.lname}} <i style ="color:green;font-size:0.65rem;text-align:justify;float:right;margin-top:8.5px;" class="fa fa-circle" aria-hidden="true"></i></li></a>
                <form  action="{% url 'usercreation:addmessage' friend.to_user.usercreation.pk %}" method="post">
                    {% csrf_token %}
                <div class="modal fade" id="chatbox" tabindex="-1" role="dialog">
                  <div class="modal-dialog" role="document">
                    <div class="modal-content">
                      <div class="modal-header text-center">
                        <h6 class="modal-title w-100">BlogChat</h6>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                        </button>
                      </div>
                    <pre><div class="modal-body"></div>

Отправить сообщение {% endfor%}

JQUERY:

<script type="text/javascript">
$('#chatbox').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) 
var recipient = button.data('whatever') 
attributes
  $.ajax({
     url: "{% url 'fetcher' %}",
     data: {
    'search': recipient
     },
      dataType: 'json',
      success: function (data) {
       list = data.list;
       $('#chatbox').find('.modal-body').text(list)

           }
       });  
       var modal = $(this)
       modal.find('.modal-title').text('Chat with ' + recipient)

       })
       </script>

ПРОСМОТРОВ:

def fetcher(request):
if request.is_ajax():
    name = User.objects.get(username=request.GET.get('search', None))
    b = ChatMessage.objects.get(user1 = request.user,user2 = name)
    print(b.message)
    data = {
        'list': b.message,
    }
    print(data)
    return JsonResponse(data)




def addmessage(request,pk):
if request.method=='POST':
    print(request.user)
    print(User.objects.get(username=UserCreation.objects.get(pk=pk)))
    obj = ChatMessage.objects.get(user1 = request.user , user2 = User.objects.get(username=UserCreation.objects.get(pk=pk)) )
    obj2 = ChatMessage.objects.get(user2 = request.user , user1 = User.objects.get(username=UserCreation.objects.get(pk=pk)) )
    name = request.POST.get('addmessage')

    obj.message += ('\n'+str(request.user)+': '+name)
    obj2.message += ('\n'+str(request.user)+': '+name)
    obj.save()
    obj2.save()
return HttpResponseRedirect(reverse('usercreation:profile',args=[request.user.usercreation.pk]))

Модели:

class ChatMessage(models.Model):
user1 = models.ForeignKey(User, on_delete=models.CASCADE ,related_name="participant1")
user2 = models.ForeignKey(User, on_delete=models.CASCADE , related_name="participant2")
message = models.TextField(default="")
date = models.DateTimeField(auto_now=True, db_index=True)