Ajax + Django：无法识别 Ajax答案

【问题标题】：Ajax + Django : Ajax is not recognizedAjax + Django：无法识别 Ajax
【发布时间】：2019-11-18 07:54:00
【问题描述】：

我不明白为什么我的AJAX请求在方法执行良好的情况下没有被JQUERY执行。

我有一个表单，使用 AJAX 方法链接到一个 JQuery 函数事件，该方法将数据发送到 Django 函数。

当我单击保存按钮时，我的页面会在浏览捕获事件的功能时重新加载。它可以很好地显示警报，但不会使用 AJAX 发送任何信息。我的功能正确吗？这是 Django 的问题吗？

这是我的 html 表单：

<form method="post" id="insert_idea__form">
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="insert_idea__titre">Titre de votre idée</label>
                                    <input type="text" class="form-control" id="insert_idea__title" required="">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="insert_idea__content">Contenu de l'idée</label>
                                    <textarea class="form-control" rows="5" id="insert_idea__content" name="centent"></textarea>
                                </div>
                            </div>                                                                        
                        </div> 
                        <button type="submit" class="btn btn-sm btn-primary">Sauvegarder</button>  
                    </form>

这是我的 JQUERY 函数：

<script type="text/javascript">         
$("#insert_idea__form").on('submit',(function(e)

    alert("Stop");

    $.ajax({
        url: '{% url "insert_idea" %}',
        type : 'POST',
        data: {
            'title': $("#insert_idea__title").val(), 
            'content': $("#insert_idea__content").val()
        },
        dataType: 'json',
        success: function (data) {
            alert('success');
        }
    });

}));
</script>

这是我在 Django 上的 url.py ：

urlpatterns = [
    url(r'^ajax/insert_idea/$', ideas.insert_idea, name="insert_idea"),
]

这是我的看法：

def insert_idea(request):
    title = request.GET.get('title')
    centent = request.GET.get('centent')

    return JsonResponse()

如果你能帮助我理解为什么没有数据发送到视图？为什么页面会重新加载？

谢谢，艾略特

【问题讨论】：

onSubmit 处理程序中的第一行必须是e.preventDefault() 以避免页面重新加载。否则页面会在 ajax 调用之前重新加载。此外，您可能希望在视图的 JsonResponse 中返回某些内容，但这不会导致问题。让我知道它是否有效，然后我会将其添加为答案
如 Vaibhav 所述，在您的 jquery 函数中使用 e.preventDefault()。此外，在您看来，def insert_idea() 在发送帖子请求时使用request.POST.get('title', '') 和request.POST.get('centent', '') 而不是request.GET.get('title', '')
通过在按钮中包含type="submit"，当您单击它到它所在的页面时，您正在提交表单。

标签： javascript jquery django ajax django-forms

【解决方案1】：

问题是发送的数据中缺少令牌csfr

【讨论】：

【解决方案2】：

<script type="text/javascript">         
        $("#insert_idea__form").on('submit',(function(e)
           e.preventDefault();    
            alert("Stop");

            $.ajax({
                url: '/insert_idea/',
                type : 'POST',
                data: {
                    'title': $("#insert_idea__title").val(), 
                    'content': $("#insert_idea__content").val()
                },
                dataType: 'json',
                success: function (data) {
                    alert('success');
                }
            });

        }));
</script>

【讨论】：