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差蟒蛇瓶

回答

相关问题