Простой jQuery пост вопрос (с использованием Django) - PullRequest
2 голосов
/ 06 марта 2011

sing django и jQuery

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

feed_list.html

<form id="get_feed_frm">
{% csrf_token %}
{% for news in new_feed %}
<ul class = {{news.pk}}>

    <button id = {{news.pk}}>  Remove</button>
     <script>
        $("#{{news.pk}}").click(function () { 
                $('ul').remove('.{{news.pk}}');
                $.post('/?ajax', { csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(), id: '{{news.pk}}'});
                }) </script>
    {{ news.question }}
    <hr />
</ul>
{% endfor %}
</form>

Я могу достичь желаемого результата с помощью этого кода.Однако, когда я удаляю строку

$('ul').remove('.{{news.pk}}');

из моего скрипта, функция не работает, и я не могу объяснить, почему это так.Я был бы очень признателен за ваш вклад в это.

-r

РЕДАКТИРОВАТЬ:

Спасибо, Юджи, я выучил пару трюков, которые помогут мне лучшенапиши мой код.Однако у меня все еще остается та же проблема.

Я разместил код под моим представлением, так как я, должно быть, делал что-то в корне неверное с моим представлением или способом отправки сообщения:

def recent_feed_view(request):

print "Entering View"
new_feed = []
if 'id' in request.POST:
    delete_id = request.POST['id'].strip()
    print "____id____" #just for debugging purpuse
    print delete_id
    n = news.objects.get(pk=delete_id)
    n.discarded = True
    n.save()

new_feed = news.objects.filter(discarded = False)

variables = RequestContext(request, {'new_feed': new_feed})

if 'ajax' in request.POST:
    print "______AJAX_______"

return render_to_response('feed_list.html', variables)  

Каждый раз, когда язапустить сайт, URL-адрес правильно связывает выполнение с правильным видом, и я получаю следующее сообщение в командной строке:

[06/Mar/2011 16:59:38] "GET /?csrfmiddlewaretoken=e724dfb883965aaa0edfb6ef521a885c HTTP/1.1" 200 1017

EDIT

Yuji,(спасибо, что познакомил меня с Chrom Dev Tool! Я все еще новичок и многому научился благодаря вам!)

Я последовал вашему совету 2 вещи произошли со мной здесь:

запуск этого кодав инструменте разработчика Chrome:

$.ajax({
                type: 'POST',
                url: '/?ajax',
                data: {
                csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(),
                id:44
                    }
                });

сервер разработчиков получил сообщение: правильная запись была удалена из моего кода, и мне пришлось вручную обновить страницу, чтобы увидеть сделанные изменения

Entering View
____id____
44
[06/Mar/2011 18:20:27] "POST /?ajax HTTP/1.1" 200 1203

Включив вышеуказанный скрипт на моем сайте, я получу:

Entering View
 ____id____
45
[06/Mar/2011 18:29:18] "POST /?ajax HTTP/1.1" 200 968
Entering View
[06/Mar/2011 18:29:18] "GET /?csrfmiddlewaretoken=e724dfb883965aaa0edfb6ef521a885c HTTP/1.1" 200 968

По какой-то причине я получаю POST и GET;Я использовал этот скрипт:

    <script type="text/javascript">
    $(function() {
        $(".remove-button").click(function() {

            $.ajax({
                type: 'POST',
                url: '/?ajax',
                data: {
                csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(),
                id:$(this).attr('id')
                    }
                });
        })
    })
       </script>

Ответы [ 2 ]

2 голосов
/ 06 марта 2011

Так как я не понимаю, почему удаление этой строки предотвратило бы появление строки $.post, я собираюсь начать предлагать исправление некоторых синтаксических проблем , что у браузера могут быть проблемы с анализом.

Вам нужны кавычки вокруг значений, которые вы вводите для имени класса и идентификатора кнопки.

Эти строки создавали проблемы для моей подсветки синтаксиса, так что, кто знает ...

<ul class = "{{news.pk}}">
    <button id = "{{news.pk}}">  Remove</button>

Также эта часть является всего лишь предложением, но вместо встраивания <script> в строку, вы должны сделать что-то вроде добавления класса к каждой кнопке, чтобы вы могли определить свое действие jquery только один раз.

Учтите это: <button id = "{{news.pk}}" class="remove-button"> Remove</button>

<script type="text/javascript">
    $(function() {
        $(".remove-button").click(function() {
            $.post('/?ajax', { 
                csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(),
                id: $(this).attr('id')
                });
        })
    })
</script>

Сервер разработчика думает, что это запрос GET - можете ли вы попробовать вручную, используя функцию $.ajax? Интересно, не перепуталась ли предыдущая версия jQuery с передачей параметров в ваш POST?

$.ajax({
  type: 'POST',
  url: '/?ajax',
  data: {
       csrfmiddlewaretoken: $(...),
       id: ...
  }
});

PS: Это место, где инструменты google chrome dev или firebug очень удобны, вы можете просто набирать команды raw jquery :)

0 голосов
/ 30 июля 2014

Вы можете настроить jQuery для извлечения токена из файлов cookie, установленных Django, и установить правильный заголовок для использования в каждом jQuery.ajax и jQuery.post.

(function($){
    if(!$) {
        return;
    }

    var match = document.cookie.match(/csrftoken=(\w+)/);
    var token = match ? match[1] : '';

    $.ajaxSetup({
        headers: { 'X-CSRFToken': token }
    });

})(window.jQuery);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...