軌道中的 Jquery Ajax 響應返回未定義的數據

Question

我正在嘗試使用 ajax 所以只有部分重新加載而不是整個網站，但數據返回未定義。 我做錯了什么嗎？ 這是代碼：

/* form.js */

$(document).ready(() => {
  $('#stock-lookup-form').on('ajax:complete', (e, data, status) => {
    /*$('#results').html(data.responseText)*/
    console.log(data) /* --> this returns undefined*/
  }) 
})

/* stock_controller.rb */

class StocksController < ApplicationController
  def search
    if params[:stock].present?
      @stock = Stock.new_from_lookup(params[:stock])
      if @stock
        render partial: 'users/result'
      else
        flash[:danger] = "You have entered an incorrect symbol"
        redirect_to my_portfolio_path
      end
    else 
      flash[:danger] = "You have entered an empty search string"
      redirect_to my_portfolio_path
    end
  end
end

/* 結果.html.erb 部分 */

<%if @stock%>
  <div class="well results-block">
    <strong>Symbol: </strong><%=@stock.ticker%>
    <strong>Name: </strong><%=@stock.name%>
    <strong>Last price: </strong><%=@stock.last_price%>
  </div>
<%end%>

/* my_portfolio.html.erb（表格所在的位置）*/

<h1>My portfolio</h1>

<h3>Search for stocks</h3>
<div id="stock-lookup">
  <%=form_tag search_stocks_path, remote: true, method: :get, id: 'stock-lookup-form' do%>
    <div class="form-group row no-padding text-center col-md-12">
      <div class="col-md-10">
        <%=text_field_tag :stock, params[:stock], placeholder:'Stock ticker symbol', autofocus:true, class:'form-control search-box input-lg'%>
      </div>
      <div class="col-md-2">
        <%=button_tag(type: :submit, class:'btn btn-lg btn-success', id:'search-btn') do%>
          <i class="fa fa-search"></i> Look up a stock
        <%end%>
      </div>
    </div>
  <%end%>
</div>
<div id="results">
  <%=render 'users/result'%>
</div>

Answer 1

[The] 對 UJS 事件處理程序的調用簽名已更改。 與帶有 jQuery 的版本不同，所有自定義事件僅返回一個參數：event。 在此參數中，有一個附加屬性詳細信息，其中包含一組額外參數。 https://guides.rubyonrails.org/working_with_javascript_in_rails.html#rails-ujs-event-handlers

$(document).ready(() => {
  $('#stock-lookup-form').on('ajax:complete', (event) => {
    const [response, status, xhr] = event.details;
    console.log(response);
  });
});