javascript - rubyonrails 中 ajax 发布后未定义的追加

Question

我试图在使用 ajax 发布后附加一些信息

这是我的路线:

match 'api/people/', to: 'people#people_get_all', via: [:get]
match 'api/people/:id', to: 'people#people_get', via: [:get]

match 'api/people/', to: 'people#create', via: [:post]

这是我的 JavaScript:

var $people = $('#people');
var $first_name = $('#first_name');

$('#add_user').on('click', function(){

    var person = {
        person: {
            first_name: $first_name.val(),
            last_name: $last_name.val(),
            location: $location.val(),
            phone: $phone.val()
        }
    };

    $.ajax({
        type: 'POST',
        url: '/api/people/',
        data: person,
        success: function(newPerson){
            $people.append('<p><strong>First Name: </strong>' + newPerson.first_name + '</p>');
        },
        error: function(){
            alert('error saving person to database');
        }
    });

});

当我点击按钮时，它会成功地将记录保存在数据库中，但是当追加发生时，它会带来一个未定义的值。

我这里有什么问题吗？

这是 Controller :

before_action :set_person, only: [:show, :edit, :update, :destroy]
def create
  @person = Person.new(person_params)

  respond_to do |format|
    if @person.save
      format.html { redirect_to @person, notice: 'Person was successfully created.' }
      format.json { render :show, status: :created, location: @person }
    else
      format.html { render :new }
      format.json { render json: @person.errors, status: :unprocessable_entity }
    end
  end
end

private

  def set_person
    @person = Person.find(params[:id])
  end


  def person_params
    params.require(:person).permit(:first_name, :last_name, :location, :phone)
  end

这就是按下按钮后发生的情况，它带来了未定义

Answer 1

您需要使用 dataType: 选项告诉 $.ajax 响应是 JSON。

$.ajax({
    type: 'POST',
    url: '/api/people/',
    data: person,
    dataType: 'json',
    success: function(newPerson){
        $people.append('<p><strong>First Name: </strong>' + newPerson.first_name + '</p>');
    },
    error: function(){
        alert('error saving person to database');
    }
});