2016-03-29 4 views
0

У меня есть "follow" кнопка на моем веб-сайте, как в Twitter. Но эта кнопка html-only без js. Я ничего не знаю о js/jquery/ajax. Может ли кто-нибудь помочь мне, что я сделал, чтобы отправить эту форму без обновления страницы? Спасибо.Отправить без обновления - Django

шаблон 'event.html':

{% if user in event.users.all %} 
     <form action="/event/{{ event.id }}/" method="GET"> 
     {% csrf_token %} 
     <input type="hidden" value="{{ event.id }}" name="remove"> 
     <input type="submit" class="btn btn-warning btn-block" value="{% trans "Remove from My Events"%}"> 
     </form> 
{% else %} 
     <form action="/event/{{ event.id }}/" method="GET"> 
     {% csrf_token %} 
     <input type="hidden" value="{{ event.id }}" name="add"> 
     <input type="submit" class="btn btn-primary btn-block" value="{% trans "Add to My Events"%}"> 
     </form> 
{% endif %} 

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} 
+2

Там нет смысла в вопросе, как это. Если вы ничего не знаете о JS или Ajax, вы должны учиться. Существует много документации, например, на сайте jQuery. –

ответ

0

Сначала овладейте Javascript и Jquery и Ajax для более четкого понимания. http://www.tutorialspoint.com/jquery/
http://www.w3schools.com/jquery/

шаблон 'event.html':

{% if user in event.users.all %} 
    <form action="/event/{{ event.id }}/" method="GET" id="event"> 
    {% csrf_token %} 
    <input type="hidden" value="{{ event.id }}" name="remove"> 
    <input type="submit" class="btn btn-warning btn-block" value="{% trans "Remove from My Events"%}"> 
    </form> 
{% else %} 
    <form action="/event/{{ event.id }}/" method="GET"> 
    {% csrf_token %} 
    <input type="hidden" value="{{ event.id }}" name="add"> 
    <input type="submit" class="btn btn-primary btn-block" value="{% trans "Add to My Events"%}"> 
    </form> 
{% endif %} 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script> 
<script> 
$('#event').submit(function(e){ 
    e.preventDefault(); 
    url = $(this).attr('action') # to get url 
    data = $(this).serialize(); # for sending form data 
    $.post(url, data, function(response){ 
      # do whatever you want with response(data) 
    }) 
}) 
</script> 
+0

спасибо, но у меня есть ошибка в этом примере - (index): 148 Uncaught TypeError: $ (...). Действия не являются функцией Что это значит? – senergo

+0

@senergo извините, я пропустил функцию. теперь это сработает. –

+0

@senergo сейчас работает. проверьте один раз. –

0

Я согласен с выше комментарий. Ниже приведен учебник, с которым я столкнулся, когда у меня возник вопрос о том, как я сделал несколько более обширный Google. Это очень полнофункциональное руководство:

The tutorial I wish I'd had when I was learning JQuery

0

невозможно, Python является языком стороны сервера, и если вы хотите обрабатывать данные, необходимо отправить информацию на сервер.

Первый раз, когда я сделал это, я видел это видео в YouTube: https://www.youtube.com/watch?v=KgnPSmrQrXI

Смежные вопросы