ajaxとレールを使用してリストに項目を追加する

Question

私はRuby on Railsアプリケーションを使用しています。そこにはユーザーの食材のリストがあります。ユーザーが成分のリストに新しい成分を加えると、成分がリストに表示されるように、ページをリフレッシュする必要があります。私は解決策のためにインターネットに見上げたが、どれも働いていない、これはアヤックスを使用して動的に行うことにしたい。

<%= form_for(:ingredientList, :url => {:controller => 'ingredients', :action => 'index'}, :remote => true) do |f| %>       
    <div class ="modal-text col-md-6"> 
      <div class="model-subtitle">Ingrediente: </div> 
      <%= f.select :value, options_for_select(@ingredient.map{ |ing| [ing.name, ing.id]}, html_options = { class: 'form-control', required: true })%> 
      </div> 
      <div class="modal-text col-md-6"> 
      <div class="model-subtitle">Quantidade: </div> 
      <%= f.text_field :quantity, class: 'form-control', placeholder: "quantidade", autofocus: true %> 
      </div> 
      <%= f.submit :Salvar, class: 'btn btn btn-success center-block'%> 

マイ：/

ここに私のHTMLコード（index.html.erb）でありますコントローラ：

def index 
@user = User.find_by id: session[:user_id] 
@ingredients = Ingredient.joins(:ingredients_users).where("user_id = ?", session[:user_id]).select("*") 
@user_id = session[:user_id] 
@ingredient = Ingredient.all 

respond_to do |format| 
    format.js 
    format.html 
    if params[:ingredientList] 
     @userIngredient = IngredientsUser.new 
     @userIngredient.ingredient_id = params[:ingredientList][:value] 
     @userIngredient.quantity = params[:ingredientList][:quantity] 
     @userIngredient.user_id = @user.id 
     if @userIngredient.save 
      flash[:success] = "Ingredient saved!" 
     else 
      @userIngredient.errors.full_messages.each do |error| 
       flash[:alert] = error 
      end 
     end 
    end 
end 

エンド

私が何か間違って（たぶんとしては機能していない）、または私は何かを追加するのを忘れた場合を作る場合、私は知りません。あなたの誰かがこれを解決する方法を知っていますか？

Answer 1

あなたのapp/views/ingredients/index.jsファイルがどのようなものかわからずにこれを言うが、あなたはそれがほぼ正しいと思う。

コントローラーでformat.jsとformat.htmlと呼ぶとすぐに、対応するビュー（たとえば：pp/views/ingredients/index.js）がレンダリングされます。 format.jsとformat.htmlの後に続くコードは、の後に実行されます。レンダリングが完了しました。

あなたのケースでは、レンダリングは入力を実際に処理する前に行われます（原料を初期化し、保存しようとします...）。アクションコードの末尾にformat.jsとformat.htmlを移動してみてください：

def index 
    @user = User.find_by id: session[:user_id] 
    @ingredients = Ingredient.joins(:ingredients_users).where("user_id = ?", session[:user_id]).select("*") 
    @user_id = session[:user_id] 
    @ingredient = Ingredient.all 

    respond_to do |format| 
     if params[:ingredientList] 
      @userIngredient = IngredientsUser.new 
      @userIngredient.ingredient_id = params[:ingredientList][:value] 
      @userIngredient.quantity = params[:ingredientList][:quantity] 
      @userIngredient.user_id = @user.id 
      if @userIngredient.save 
       flash[:success] = "Ingredient saved!" 
      else 
       @userIngredient.errors.full_messages.each do |error| 
        flash[:alert] = error 
       end 
      end 
     end 

     format.js 
     format.html 
    end 
end 

ことのすべては、あなたがRailsの規約を「違反」している、と述べました。インデックスアクションは、主にに使用し、オブジェクトを取得します。データを保存するには、（新規レコードの場合）または更新（既存レコードの変更の場合）のいずれかを使用する必要があります。