Отправить без обновления в Django

-2

У меня есть html-форма и кнопка отправки (она добавляет или удаляет отношения во многих пользователей ")":

{% if user in event.users.all %}
     <form action="/event/{{ event.id }}/" method="GET">
            <input type="hidden" value="{{ event.id }}" name="remove">
            <input type="submit" value="Remove">
      </form>
{% else %}
     <form action="/event/{{ event.id }}/" method="GET">
            <input type="hidden" value="{{ event.id }}" name="add">
            <input type="submit" value="Add">
      </form>

в views.py:

def show_event(request, event_id):
    ...
    event = get_object_or_404(Event, id=event_id)
    user = request.user
    if request.GET.get('add'):
        event.users.add(user)
        event.save()
    if request.GET.get('remove'):
        event.users.remove(user)
        event.save()
    return render(request, 'events/event.html', {'event':event, 'user':user,})

Эта функция работает нормально, но страница обновляется после отправки формы. Мне не нужно обновляться, и мне нужно изменить текст кнопки, как кнопка "Follow" в Twitter. Я попытался использовать некоторый jquery\ajax, но я точно не понимаю, как он должен работать. Может ли кто-нибудь объяснить, как это сделать? Благодарю.

  • 0
    Можете ли вы опубликовать пробный ajax / javascript, который не работает? Какие ошибки это вызывало?
  • 0
    @CurtisOlson Я думаю, что вещи, которые я пробовал, не имеют абсолютно никакого смысла, поэтому я просто не могу понять, что нужно сделать, чтобы эта кнопка отправки стала чем-то вроде кнопки подписки Twitter
Теги:
submit

1 ответ

2
Лучший ответ

Вот очень простой пример ajax. В вашей форме вы можете запустить свой метод ajax с помощью:

<a onclick="AjaxFormSubmit()" href="#">Submit</a>

Тогда ваш метод ajax будет выглядеть следующим образом:

function AjaxFormSubmit() {
    $.ajax({
        url : '/event/{{ event.id }}/',
        type : "POST",
        data : { the_post : $('#id-of-your-field').val() }
    }).done(function(returned_data){

        // This is the ajax.done() method, where you can fire events after the ajax method is complete 

        // For instance, you could hide/display your add/remove button here

    });
}

Я рекомендую посмотреть документацию Ajax, чтобы просмотреть все доступные Ajax-методы.

Кроме того, на ваш взгляд, вам нужно будет вернуть (в этом примере) данные json через HttpResponse. т.е.

return HttpResponse(json.dumps(your_data))
# I like to return success/fail Booleans, personally

* Обратите внимание, что это непроверенный код.

Поделиться
  • 0
    где я должен разместить этот метод AJAX?
  • 0
    Где-то под вашей формой или во внешнем файле .js. Если вы используете внешний файл .js, вы, очевидно, не сможете использовать синтаксис шаблона django для event.id , но вы можете просто передать это в качестве аргумента AjaxFormSubmit
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню