將Javascript數據傳遞給Django

Question

我是Django（和Web開發）的新手，發現自己正在為這個問題而苦苦掙扎：我使用javascript構建了一個簡單的計時器，現在希望模型中的變量在計時器啟動時進行更新。 我不知道該怎么做。

這是我的代碼：

home.html ：

<button onclick='activatecount()' value='countdown'>Start Timer</button>
<p id='countdown'></p>
<p id='endofcount'></p>

<script src='{{ STATIC_URL }}timerapp.js'></script>
</body>
</html>

然后是javascript 。 屏幕上有一個按鈕，當用戶單擊該按鈕時，計時器開始遞減計數。

var myTime = setInterval(displayTime, 1000);//Calls the function displayTime once every second
function subtractSeconds(){
seconds--;
document.getElementById('countdown').innerHTML = seconds; }

var interval;
var minutes = 2;
var seconds = 10;

function activatecount(){
    countdown('countdown');
}

function countdown(element) {
    interval = setInterval(function() {
        var el = document.getElementById(element); 
        if(seconds == 0) { 
            if(minutes == 0) {
                el.innerHTML = "countdown's over!";  
                clearInterval(interval); 
                return;
            } else { 
                minutes--;
                seconds = 60;
            }
        } 
        if(minutes > 0) { 
            var minute_text = minutes + (minutes > 1 ? ' minutes' : ' minute');
        } else {
            var minute_text = '';
        }
        var second_text = seconds > 1 ? 'seconds' : 'second';
        el.innerHTML = minute_text + ' ' + seconds + ' ' + second_text + ' remaining';
        seconds--; 
        }, 1000); 
}

我的views.py ：

def home(request):
    return render_to_response('home.html', context_instance=RequestContext(request))

最后是我的models.py ：

class User(models.Model):
    username = models.CharField(max_length=10)
    email = models.EmailField(max_length=254)
    first_name = models.CharField(max_length = 20)
    last_name = models.CharField(max_length = 20)
    join_date = models.DateField().auto_now_add
    block_count = models.IntegerField()

def __unicode__(self):
    return self.username

我想要的是在計時器啟動時將block_count加一。 （我稍后將添加更多功能，但是我似乎完全不了解這個瑣碎的事情。）我所能找到的只是關於如何使用表單和POST向數據庫提交數據的討論，但是我這里沒有使用表單。

應該在這里使用POST嗎？ 如果是這樣，怎么辦？

Answer 1

創建第二個視圖以更新模型。 如果希望在數據庫更新時能夠停留在同一頁面上，請使用jquery的.ajax方法調用第二個視圖。

就像是：

views.py

def ajax(request):
    if request.is_ajax():
    // add 1 to your block count

jQuery的：

function countdown(element) {
interval = setInterval(function() {
    var el = document.getElementById(element); 
    if(seconds == 0) { 
        if(minutes == 0) {
            el.innerHTML = "countdown's over!";  
              $.ajax({
                type:"POST",
                url :"/ajax-url/",
                error:function(data){alert('Error');}
                success:function(data{alert('OK!');}
                });
            clearInterval(interval); 
            return;
            // etc etc

網址：

url(r'^ajax-url/$', 'views.ajax'),

這是一般的想法。 我尚未測試此代碼，但它應該為您提供一個起點，讓您了解如何解決您的問題。

Answer 2

您可以創建一個這樣的表格

<form name="myform" action="/update-model/ method="post">
<input type="hidden" name="update" value="yes">
</form>

和這樣的觀點

def update_model(request):
    if request.POST:
        if request.POST['update']:
            #do your code here.

和你的JavaScript這樣

    if(minutes == 0) {
            el.innerHTML = "countdown's over!";  
            document.myform.submit();
            clearInterval(interval); 
            return;
        } else { 
            minutes--;
            seconds = 60;
        }

在Django（通常是Web應用程序）中，當您需要服務器執行某項操作時，可以向其發送HTTP請求。 這是通過將方法映射到url（urls.py）來完成的。 然后您可以棄用1.5

url = "{% url my_url_name %}"

您可以選擇如何通過網絡瀏覽器發送該請求（您的網絡應用程序的GUI，對嗎？）

• 異步
• 同步

同步發送請求需要標准頁面加載。 Google的主頁表單是同步的。 您希望在請求需要將用戶移至另一個頁面或應用程序需要在提交后重新啟動時執行此操作。 您可以通過表單提交和鏈接來完成此操作。

異步發送請求允許頁面的不同部分在不同時間加載（重新加載），並且服務器可以對其進行處理。 從google搜索結果頁面再次搜索會異步獲取搜索結果。 您可以使用稱為ajax的技術來執行此操作。