使JS请求到我的Rails API

Making JS request to my Rails API

本文关键字：Rails API 我的 JS 请求      更新时间：2023-09-26

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

这是我的HTML文件:(add-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>

当我点击提交，$.post()只是添加数据到我的url…数据没有添加到我的模型中…

My users_controller code:

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

实际上你不需要使用$。通过在表单标记本身中指定action url来提交表单。请务必检查以下内容。

<form action="/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>

黄恒的回答应该能奏效。我知道你可能只是想让这个工作，但想指出的是，你想避免在这样的post request中使用完整的url。这是不必要的，而且当您将代码迁移到阶段和生产区域时，可能会引入更大的问题。

试试这个:

<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命令查看。

编辑:

在这种情况下，你真的不需要form元素。

编辑# 2:如果在创建用户之后需要重定向，则根本不需要ajax。您应该使用form_for rails帮助器，它将帮助您为用户模型构建表单。在这种情况下，不需要任何javascript代码。

相关文章：