2013-03-11 30 views
19

我試圖寫一個Django應用程序,我停留在如何我可以調用視圖功能單擊按鈕時。如何調用按鈕Django的功能,點擊

在我的模板,我有一個鏈接按鈕,點擊後下面帶你到不同的網頁。

<a target="_blank" class="btn btn-info pull-right" href="{{ column_3_item.link_for_item }}">Check It Out</a> 

當按鈕被點擊時,我想調用一個Django查看功能(以及重新指向目標網站)。查看功能是增加數據庫中存儲按鈕被點擊次數的值。

任何人都可以請幫助我,我可以如何實現這一點。

編輯: -

抱歉的混淆。 column_3_item.link_for_item是到外部網站的鏈接(例如: - www.google.com)。現在,當點擊該按鈕時,它會打開一個新窗口,該窗口用於Google網站。我想要做的就是調用一個django視圖函數,當點擊按鈕更新數據庫而不刷新頁面時。

謝謝

+1

我不明白你的問題。你的代碼在任何'column_3_item.link_for_item'被映射到你的urlconf的時候調用view函數。 – 2013-03-11 14:40:56

+0

添加到丹尼爾的評論:如果你需要點擊 - >「實時」更新couter,而不刷新頁面,你可能需要重寫你的問題。如果您有指向該鏈接的視圖,您已經擁有了您需要的內容 – 2013-03-11 14:48:00

+0

對此感到抱歉。 'column_3_item.link_for_item'是外部網站的鏈接(例如: - www.google.com)。現在,當點擊該按鈕時,它會打開一個新窗口,該窗口用於Google網站。我想要做的就是調用一個django視圖函數,當點擊按鈕更新數據庫而不刷新頁面時。 – Dev 2013-03-11 14:49:11

回答

23

這裏是一個純粹的JavaScript,簡約的方法。我使用JQuery,但可以使用任何庫(or even no libraries at all)。

<html> 
    <head> 
     <title>An example</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script> 
      function call_counter(url, pk) { 
       window.open(url); 
       $.get('YOUR_VIEW_HERE/'+pk+'/', function (data) { 
        alert("counter updated!"); 
       }); 
      } 
     </script> 
    </head> 
    <body> 
     <button onclick="call_counter('http://www.google.com', 12345);"> 
      I update object 12345 
     </button> 
     <button onclick="call_counter('http://www.yahoo.com', 999);"> 
      I update object 999 
     </button> 
    </body> 
</html> 

替代做法

不是把JavaScript代碼,你可以改變你的鏈接是這樣的:

<a target="_blank" 
    class="btn btn-info pull-right" 
    href="{% url YOUR_VIEW column_3_item.pk %}/?next={{column_3_item.link_for_item|urlencode:''}}"> 
    Check It Out 
</a> 

,並在您views.py

def YOUR_VIEW_DEF(request, pk): 
    YOUR_OBJECT.objects.filter(pk=pk).update(views=F('views')+1) 
    return HttpResponseRedirect(request.GET.get('next'))) 
+12

如果downvoting請解釋爲什麼在評論中,我可以改進我的回答 – furins 2013-03-11 16:45:30

+0

非常感謝。我使用了替代方法,並且按預期完美地工作。 – Dev 2013-03-11 18:51:10