使用 Django 和 jquery 进行 Ajax 发布

发布于 2024-10-05 16:17:17 字数 930 浏览 4 评论 0原文

我对所有 django、ajax 都是新手。我在网上阅读了一些教程,我正在尝试制作一个简单的表单,通过 ajax 发布一些信息。

这是我的模板的 jquery 部分:

<script type="text/javascript">

 $(document).ready(function () {

  $('#iEventAjax').submit( function()
  {
   var name = $('input[name=event_name]');
   var data = name.val();
   $.ajax({
                                type:"POST",
                                url:"/mediaplanner/edit/",
                                data:data,
                                success: function(msg){
                                        alert(msg);
                                }
                        });
  });

和视图代码:

def iEventAjax(request):
        if request.is_ajax():
                return HttpResponse("ok")
        else:
                return render_to_response("iEventSave.html",{})

好吧,当我发布某些内容时,它返回 iEventSave.html 而不是给出“ok”消息。 有什么建议吗,我哪一部分失败了?

I'm new to all django, ajax things .. I read some tutorials on the net and I'm trying to make a simple form which posts some information via ajax.

Here is jquery part of my template :

<script type="text/javascript">

 $(document).ready(function () {

  $('#iEventAjax').submit( function()
  {
   var name = $('input[name=event_name]');
   var data = name.val();
   $.ajax({
                                type:"POST",
                                url:"/mediaplanner/edit/",
                                data:data,
                                success: function(msg){
                                        alert(msg);
                                }
                        });
  });

And the view code :

def iEventAjax(request):
        if request.is_ajax():
                return HttpResponse("ok")
        else:
                return render_to_response("iEventSave.html",{})

Well, when i post something, it returns iEventSave.html instead of giving the "ok" message.
Any suggestions, which part do I fail ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

白昼 2024-10-12 16:17:17

这段代码发生了什么:

  1. 您将一个处理程序绑定到表单上
    提交
  2. 然后提交一个ajax
    返回“ok”的响应
  3. 表单继续作为常规 HTML 表单提交
  4. 第二次提交
    返回模板,因为它是
    GET 请求,而不是 AJAX

在 jQuery 中,您需要从提交函数返回 false,或者在事件 jQuery Submit 上调用 PreventDefault文档

所以:

$(document).ready(function () {

$('#iEventAjax').submit( function()
{
 var name = $('input[name=event_name]');
 var data = name.val();
 $.ajax({
                            type:"POST",
                            url:"/mediaplanner/edit/",
                            data:{my_data:data},
                            success: function(msg){
                                    alert(msg);
                            }
                    });
return false;
});

What is happening with this code:

  1. You bind a handler to the form on
    submit
  2. You then submit an ajax
    response which returns "ok"
  3. The form continues to submit as a regular HTML form
  4. The second submission
    returns the template because it is a
    GET request, not AJAX

In jQuery you need to either return false from the submit function, or call preventDefault on the event jQuery Submit Docs

So:

$(document).ready(function () {

$('#iEventAjax').submit( function()
{
 var name = $('input[name=event_name]');
 var data = name.val();
 $.ajax({
                            type:"POST",
                            url:"/mediaplanner/edit/",
                            data:{my_data:data},
                            success: function(msg){
                                    alert(msg);
                            }
                    });
return false;
});
痴意少年 2024-10-12 16:17:17

您想要执行 var data = name.serialize(); 来创建查询字符串参数。

You want to do var data = name.serialize(); to create a query-string parameter.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文