Как реализовать автоматическое обновление блока с комментариями без перезагрузки страницы?

Question

rumak @rumak

Как реализовать автоматическое обновление блока с комментариями без перезагрузки страницы?

Есть шаблон base.html:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>{% block title %}{% endblock %}</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script>
        setTimeout(F1, 2000);
            function F1(){
                $.get('/', function(data){
                    $('#comment').html(data);
                });
                setTimeout(F1, 2000);
            }
        </script>
    </head>
    <body>
        {% block content %}

        {% endblock %}
    </body>
</html>

И есть comments_list.html, заполняющий блок content:

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

{% block title %} Тестовая задача | Все комментарии {% endblock %}

{% block content %}
    <div id="comment">
        <h2>Все комментарии</h2>
        {% for comment in comments %}
                <hr>
                Имя: {{ comment.name }}<br>
                Email: {{ comment.email }}<br>
                Комментарий: <b>{{ comment.text }}</b><br>
                Дата: {{ comment.create }}<br>
                    <a href="{% url 'comments:comment_delete' pk=comment.pk %}" onclick="return confirm('Точно удалить?')">Удалить</a>
                <hr>
        {% endfor %}
    </div>
    <div class="row">
        <div id="form">
            <h2>Добавить новый комментарий</h2>
            <form method="POST" action="#" id="form">{% csrf_token %}
                {{ form.as_p }}
                <button type="submit">Отправить</button>
            </form>
            <hr>
        </div>
        <div class="pagination">
            <span class="step-links">
                {% if comments.has_previous %}
                    <a href="?page={{ comments.previous_page_number }}">Назад</a>
                {% endif %}

                <span class="current">
                    Страница {{ comments.number }} из {{ comments.paginator.num_pages }}.
                </span>

                {% if comments.has_next %}
                    <a href="?page={{ comments.next_page_number }}">Вперёд</a>
                {% endif %}
            </span>
        </div>
    </div>
{% endblock %}

Сам скрипт вставлен в base.html. Работает он не так, как хотелось бы: после обновления на странице появляются две формы, в которые невозможно написать какие-либо данные, т.к. после обновления всё введённое исчезает.
Вопрос: Что мне исправить/переделать, чтобы обновлялись только комментарии?
Спасибо!