從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函數？

回答

相關問題