jQuery和表單POST差蟒蛇瓶

我試圖弄清楚如何使用jQuery AJAX與Python的瓶模塊。jQuery和表單POST差蟒蛇瓶

我已經創建了一個包含兩個按鈕，一個的jQuery控制，另一種形式的提交按鈕裏面一個非常基本的頁面。兩個按鈕只是發送一個POST請求到一個瓶子服務器，它應該用「完成！」來回應。信息。

這是模板的代碼：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Test Template</title> 
     <!-- JQuery JS --> 
     <script src="http://code.jquery.com/jquery.js"></script> 

     <script> 
      $(document).ready(function() { 
       $('button').on('click', function(){ 
        $.post("/home"); 
       }); 
      }); 
     </script> 

    </head> 
    <body> 
     <button>Submit</button> 
     <form action="/home" method="post" enctype="multipart/form-data"> 
      <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html>

這是瓶子服務器的代碼：

from bottle import route, run, template 

@route('/home') 
def home(): 
    return template('template') 

@route('/home', method='POST') 
def homePost(): 
    return "Done!" 

run(host='localhost', port=8080, debug=True) 
run(reloader=True)

爲什麼點擊表單按鈕正確返回信息，但點擊了jQuery一個什麼都不做？ jQuery是否阻止瓶子的迴應？

感謝您的幫助。

Pablo

來源

2013-07-01 MonkeyButter

...因爲jquery按鈕發送一個ajax請求到服務器。 ajax請求發生在幕後，對頁面沒有任何作用。在另一方面，當你點擊一個表單的提交按鈕一個新的頁面加載包含任何服務器發回。

您需要在jquery ajax請求中指定一個函數，該函數將在服務器返回數據時調用。在函數內部，你可以對數據進行處理 - 通常是將其插入到現有的標籤，例如

$.post("/home", function(dataFromServer) { 
    $('#mydiv').html(dataFromServer); 
}

一個Ajax請求的好處是，你可以從服務器獲取數據，然後將其插入到頁面中 - 無需重新加載頁面。

來源

2013-07-01 06:52:40 7stud

水晶清楚！非常感謝7stud。 – MonkeyButter

jQuery和表單POST差蟒蛇瓶

回答

相關問題