Problem with updating data using js in django chat

Good afternoon Here i have django application, where must be chat It dont need to be without delay, because of that i did it using simple models and tryed to make html grab new data about messages using js As i readed in internet, it must work, but i think i made error, if someone can help, i will be very gratefull

here is chat.html

{% extends 'women/base.html' %}

{% load static %}
{% block content %}
<h1>Chat</h1>

<ul>
    {% for message in messages %}
    <li>
        <strong>{{ message.author.username }}:</strong> {{ message.content }} - {{ message.timestamp }}
    </li>
    {% endfor %}
</ul>

<form method="post" action="{% url 'send_message' chat.id %}">
    {% csrf_token %}
    <label for="message">Message:</label><br>
    <textarea id="message" name="content" rows="4" cols="50"></textarea><br>
    <button type="submit">Send</button>
</form>
{% endblock %}

{% block javascript %}
<script src="{% static 'women/js/chat.js' %}"></script>
{% endblock %}

it trying to call js file in my static folder women(application name)/static/women/js/chat.js

$(document).ready(function(){
    // Extract chat_id from the URL
    var chat_id = window.location.pathname.split('/')[2];

    function fetchMessages(){
        $.ajax({
            url: '/chat/' + chat_id + '/',  // replace with your view's URL
            success: function(data){
                // assuming 'data' is a list of messages
                $('ul').empty();  // clear the current list
                data.forEach(function(message){
                    $('ul').append('<li><strong>' + message.fields.author + ':</strong> ' + message.fields.content + ' - ' + message.fields.timestamp + '</li>');
                });
            }
        });
    }
    fetchMessages();  // fetch messages immediately when the page loads
    setInterval(fetchMessages, 1000);  // then fetch messages every 20 seconds
});

this is view function for chat

def chat_view(request, chat_id):
    chat = Chat.objects.get(id=chat_id)
    messages = Message.objects.filter(chat=chat)

    # Check if the request is an AJAX request
    if request.is_ajax():
        # Serialize the messages to JSON and return a JsonResponse
        messages_json = serializers.serialize('json', messages)
        return JsonResponse(json.loads(messages_json), safe=False)

    context = {
        'chat': chat,
        'messages': messages
    }
    return render(request, 'women/chat.html', context)


def send_message(request, chat_id):
    if request.method == 'POST':
        chat = Chat.objects.get(id=chat_id)
        content = request.POST.get('content')  # Assuming 'content' is the name of your input field
        message = Message(chat=chat, author=request.user, content=content)
        message.save()
        return redirect('chat_view', chat_id=chat.id)  # Assuming 'chat_view' is the name of your chat view

and i think you maybe need to see urls for chatting

    path('initiate-chat/<int:post_id>/', initiate_chat, name='initiate_chat'),
    path('chat/<int:chat_id>/', chat_view, name='chat_view'),
    path('chat/<int:chat_id>/send/', send_message, name='send_message'),

It can save messages, but js file that must grab new messages without reloading page is not work

I tryied to fiend error, but i did not. I will be very gratefull to someone who can help me.

Back to Top