jquery - 使用 Sinatra 和 jQuery 而无需在 POST 上重定向

Question

我正在尝试使用 jQuery 向我的 Sinatra 应用程序提交表单，但是当通过 AJAX 发布时，Sinatra 应用程序显示一个空白页面。我希望它停留在同一页面上，并更新我在 javascript 中指定的内容。这是我的代码，经过精简:

post '/register' do
  register( params )
end
get '/register' do
  haml :register
end

这是我在 haml 文件中的 javascript:

:javascript
        $(function() {
                $("button#submit").click(function(){
                        $.ajax({
                                type: "POST",
                                url: "/register",
                                data: $('form.register').serialize(),
                                success: function(){
                                        $("#message").html("Successfully registered")
                                },
                                error: function(){
                                        $("#message").html("Not Successful")
                                }
                        });
                });
        });

Answer 1

试试这个，

$(function() {
  $("form#the_id").submit(function(e){
    e.preventDefault();

    $.ajax({
      type: "POST",
      url: "/register",
      data: $('form.register').serialize(),
      success: function(){
        $("#message").html("Successfully registered")
      },
      error: function(){
        $("#message").html("Not Successful")
      }
    });
  });
});

$("form#the_id").submit(... 检测表单提交。e.preventDefault(); 阻止表单提交。其余提交Ajax 请求。

不要忘记将 #the_id 更改为您的表单 ID。