向我的Rails API发送JS请求

Question

我是rails新手。 我正在创建一个基本的rails-api。试图将用户添加到使用JS请求我的模型......

这里是我的HTML文件：（附加user.html）

<script type="text/javascript" charset="utf-8"> 
    $(function() { 
     $('#adduser').submit(function(e){ 
      $.post('http://localhost:3000/users', {user: {username: $("#usr").value}, user: {password:$("#psw").value}}); 
    }); 
    }); 
</script> 

<form id="adduser" data-ajax="false"> 
<input type="text" id="usr" placeholder="Username"/> 
<input type="password" id="psw" placeholder="Password"/> 
<input type="submit" value="Add User" id="usradd" name="login"/> 
</form> 

当我点击提交，$。员额（）简单相加数据到我的网址... 的数据不会被添加到我的模型......

我users_controller代码：

def new 
    @user = User.new 
    render json: @user 
end 

def create 
@user = User.new(params[:user]) 

if @user.save 
    render json: @user, status: :created, location: @user 
else 
    render json: @user.errors, status: :unprocessable_entity 
end 
end 

Answer 1

试试这个：

<input type="text" id="usr" placeholder="Username"/> 
<input type="password" id="psw" placeholder="Password"/> 
<input type="button" value="Add User" id="usradd" name="login"/> 

$(function() { 
    $('#usradd').click(function(e){ 
     var user = { 
      username: $("#usr").val(), 
      password: $("#psw").val() 
     } 
     $.post('/users/create', user); 
    }); 
}); 

'/ users/create' - 我认为它应该看起来像这样，但它取决于你的路径设置。要找出它使用rake：routes命令。

编辑：

你并不真的需要在这种情况下表单元素。

编辑＃2： 如果在用户创建后需要重定向，则根本不需要ajax。你应该使用form_for rails helper，它可以帮助你为你的用户模型构建一个表单。在这种情况下，您不需要任何JavaScript代码。

Answer 2

亚温的答案应该能够做到。我意识到你可能只是试图让这个工作，但想指出，你想避免在这样的发布请求中使用完整的网址。它不是必需的，当您将代码迁移到舞台和制作区域时，可能会引入更大的问题。

Answer 3

实际上，您不需要使用$ .post，因为您可以通过在表单标记中指定操作url来提交表单。请检查以下内容。

<form action="https://stackoverflow.com/users/create" method="post"> <input type="text" id="usr" placeholder="Username"/> <input type="password" id="psw" placeholder="Password"/> <input type="button" value="Add User" id="usradd" name="login"/> </form>