从Django视图执行jQuery函数？

我有一个注销视图，当用户成功注销时，我想执行一个jQuery函数，它说“你已经注销了！”在吐司弹出。我如何从Django视图调用jQuery函数。我从这里jQuery代码：http://shawntabai.com/wp/2011/09/06/toast-notifications-using-jquery/从Django视图执行jQuery函数？

VIEWS.PY：

def signout(request): 
    logout(request) 
    return HttpResponseRedirect(reverse(index))

存储在我的头

jQuery的功能：

<head> 
<script type="text/javascript"> 
    function toast(sMessage) 
{ 
    var container = $(document.createElement("div")); 
    container.addClass("toast"); 

    var message = $(document.createElement("div")); 
    message.addClass("message"); 
    message.text(sMessage); 
    message.appendTo(container); 

    container.appendTo(document.body); 

    container.delay(100).fadeIn("slow", function() 
    { 
     $(this).delay(2000).fadeOut("slow", function() 
     { 
      $(this).remove(); 
     }); 
    }); 
} 
</script> 
<head>

我可以做这样的事情：

def signout(request): 
    logout(request) 
    return HttpResponseRedirect(reverse(index, "$(document).ready(function(){toast('test');});"))

来源

2012-08-03 thedeepfield

添加您的脚本标记：

$(document).ready(function(){ 
    toast("test"); 
});

来源

2012-08-03 19:43:13

所以，当我这样做 “试验” 弹出，但我怎么得到它做的是从内Django的signout视图？ – thedeepfield 2012-08-03 19:46:23

将代码放在签出视图中，并用“您已注销”代替测试 – 2012-08-03 19:47:23

对不起，我是jQuery/Django的新手...您的意思是这样的：def signout（request）：注销（请求） return HttpResponseRedirect（reverse（index，“$（document）.ready（function（）{toast（'test'）;}）;”）） – thedeepfield 2012-08-03 20:10:00

我建议使用Django消息，而不是 - https://docs.djangoproject.com/en/dev/ref/contrib/messages/。

您可以检查模板中是否填入了“消息”并显示Toast通知。

来源

2012-08-03 20:36:31 dannyroa

不幸的是，我不知道JQuery，所以这将是更伪代码-y/Prototype-y，但这是最好的方式。（JQuery的用户，随时与实际的JQuery解决它）

在您的注销链接，添加事件处理程序，做一个Ajax请求的观点：

$('a').click(function() { 
    Ajax.send('/path/to/logout/', { 
     onSuccess: function(response) { 
     toast(response.responseText, function() { 
      window.location = '/path/to/index/'; 
     }); 
     }, 
     onFailure: function(response) { 
     toast(response.responseText); 
     } 
    }); 
})

注意，我添加了第二个参数toast()。你会想改变举杯此：

function toast(sMessage, action) 
{ 
    var container = $(document.createElement("div")); 
    container.addClass("toast"); 

    var message = $(document.createElement("div")); 
    message.addClass("message"); 
    message.text(sMessage); 
    message.appendTo(container); 

    container.appendTo(document.body); 

    container.delay(100).fadeIn("slow", function() 
    { 
     $(this).delay(2000).fadeOut("slow", function() 
     { 
      $(this).remove(); 
      if (action) action(); 
     }); 
    }); 
}

最后，认为：

def signout(request): 
    if logout(request): 
     return HttpResponse('You have successfully logged out!') 
    else: 
     return HttpResponseBadRequest('There was an error logging out.')

来源

2012-08-03 20:48:45 Izkata

答：我结合两的答复让我的答案是：

在您的标题中使用jQuery插件http://shawntabai.com/wp/2011/09/06/toast-notifications-using-jquery/
使用django消息框架：
将{{message}}插入到jQuery脚本中。

VIEW.PY

def signout(request): 
    logout(request) 
    messages.add_message(request, messages.INFO, 'Signout Successful.') 
    return HttpResponseRedirect(reverse(index))

的index.html

{% if messages %} 
    {% for message in messages %} 
     <script type="text/javascript"> 
      $(document).ready(function(){toast("{{ message }}");}); 
     </script> 
    {% endfor %} 
{% endif %}

来源

2012-08-06 21:28:20 thedeepfield

从Django视图执行jQuery函数？

回答

相关问题