2012-09-16 149 views
0

我有一個HTML頁面,其中包含一個形式,我想,當表單成功submited,顯示下面的div:提交一個表單的jQuery功能

<div class="response" style="display: none;"> 
    <p>you can download it<a href="{{ link }}">here</a></p> 
</div> 

我也有一個jQuery函數:

<script type="text/javascript"> 
     $(function() { 
      $('#sendButton').click(function(e) {    
       e.preventDefault(); 
       var temp = $("#backupSubmit").serialize(); 
       validateForm(); 
       $.ajax({ 
        type: "POST", 
        data: temp, 
        url: 'backup/', 
        success: function(data) { 
         $(".response").show(); 
        } 
       }); 
      }); 
     }); 

</script> 

和我的views.py(後面的代碼)我創建一個鏈接並將其傳遞給html頁面。我有:

def backup(request): 
    if request.is_ajax(): 
     if request.method=='POST': 
      //create a link that user can download a file from it. (link) 
      variables = RequestContext(request,{'link':link}) 
      return render_to_response('backup.html',variables) 
     else: 
      return render_to_response('backup.html') 
    else: 
     return render_to_response("show.html", { 
      'str': "bad Request! :(", 
      }, context_instance=RequestContext(request)) 
backup = login_required(backup) 

我的問題:似乎我的看法不執行。它不會顯示我發送到此頁面的鏈接。似乎只有jQuery功能被執行。我很困惑。我怎麼能讓他們兩個執行(我的意思是jQuery功能,然後我設置在這個功能,這使我的看法執行的網址。)

我不知道如何使用序列化功能。每當我搜索,他們寫道:

的.serialize()方法創建在標準URL編碼符號的文本串,並且產生的查詢字符串,如「a = 1時& B = 2 & C = 3 & d = 4 & E = 5。

我不知道什麼時候我不得不使用它,而我可以在request.Post訪問我的表單字段[「字段名」]。我不知道是什麼應該是成功的數據:功能(數據)在我的情況下。

非常感謝fo你的幫助。

回答

1

你必須獲得並顯示你的Ajax POST功能,其中data是你通過你的Django服務器呈現響應的data,例如:

t = Template("{{ link }}") 
c = Context({"link": link}) 
t.render(c): 

你的JS/jQuery的應該成爲這樣的事情:

<script type="text/javascript"> 
    $(function() { 
     $('#sendButton').click(function(e) {    
      e.preventDefault(); 
      var temp = $("#backupSubmit").serialize(); 
      validateForm(); 
      $.ajax({ 
       type: "POST", 
       data: temp, 
       url: 'backup/', 

       success: function(data) { 
        // 'data' is the response from your server 
        // (=the link you want to generate from the server) 

        // Append the resulting link 'data' to your DIV '.response' 
        $(".response").html('<p>you can download it<a href="'+data+'">here</a></p>'); 

        $(".response").show(); 
       } 
      }); 
     }); 
    }); 
</script> 

希望這有助於。

+1

等待隊友..我有點困惑你的答案... XD的事情是:當你提交你點擊你的'sendButton',你通過你的函數在views.py中收到一個Ajax請求。所以,在這個函數中,你必須生成你的鏈接並渲染它(沒有模板:只是「打印」鏈接)。一旦它被渲染,這個呈現的信息(=你的鏈接)將作爲'data'(成功函數中的變量)發送。然後將這個新生成的鏈接添加到您的DIV,然後就可以了。我不確定我是否清楚:S ...告訴我,如果我錯了,或者如果它不是你真正想要的。 – Littm

+0

非常感謝。正如你所說的數據是來自服務器的響應,我從views.py收到。你是什​​麼意思「t = Template(」{{link}}「) c = Context({」link「:link}) t.render(c):」?我發送鏈接數據到我的HTML頁面通過render_to_response,我的問題是我不知道在哪裏接收它在html頁面?你能告訴我在哪裏可以創建數據(使用鏈接)在HTML中。如果數據應該是從視圖中收到的「鏈接數據」,那麼什麼是「數據:溫度」?爲什麼我應該使用「數據:溫度」?總是需要使用序列化?對不起,這是我第一次使用這個函數:「>謝謝你的幫助:) – user1597122

+0

aha,你的意思是說,只要我傳遞一個字典到我的模板(html文件),(這是我的例子中的鏈接),參數「數據」自動包含鏈接,如果我發送到字典(鏈接和s.th其他),「數據」包含兩個? – user1597122