JavaScriptからRailsコントローラのアクションをトリガーする

Question

フォームのアンケートの一部です。特定の回答が選択されている場合は、フォームに追加の質問が表示されます。私はこれらの質問に対する回答を保存し、回答を変更できるようにする必要があります。私は意思決定をa）の場所で行い、b）Railsで行うので、私は@assessmentオブジェクトであり、@assessmentオブジェクトの状態に基づいてさまざまな質問を表示または非表示にします。

私は、AJAXを使って往復を設定する方法について頭を悩ましています。私のフォームは部分的なので、@assessmentオブジェクトが更新されているので、私はそれをリロードすることができます。私が見た例のほとんどは、フォームを送信し、POSTアクションを使用してRailsオブジェクトにパラメータを渡し、JavaScriptを使用して部分を再レンダリングする例です。私はラジオボタンonClickを使ってそれをやろうとしていますが、実際に新しく更新された@assessmentオブジェクトを実際に取得する方法を理解することはできません。

どうすればよいですか？私はもっ​​と良い方法を見つけようと努力すべきではありませんか？

ここでは簡略化した形部分、_form.html.hamlです：@assessmentがその上に期日に自動的に作成されるので、これは（edit.html.hamlからこのdiv要素に含まれている

= bootstrap_form_for @assessment, as: :put, url: project_assessment_path(@project), remote: :true do |f| 

    .panel.panel-default 
    .panel-heading 
     .panel-title Lorem ipsum dolor sit amet 
    .panel-body 
     = answer_question_1(@project) 
    - if show_question(@assessment, :question_2) 
    .panel.panel-default 
     .panel-heading 
     .panel-title Lorem ipsum dolor sit amet? 
     .panel-body 
     = f.radio_button :question_2, true, label: "Yes", inline: true, remote: :true 
     = f.radio_button :question_2, false, label: "No", inline: true, remote: :true 
    - if show_question(@assessment, :question_3) 
    .panel.panel-default 
     .panel-heading 
     .panel-title Lorem ipsum dolor sit amet? 
     .panel-body 
     = f.radio_button :question_3, true, label: "Yes", inline: true, remote: :true 
     = f.radio_button :question_3, false, label: "No", inline: true, remote: :true 

    ... 

    - if @assessment.complete? 
    - case @assessment.assessment_message 
     - when :not_applicable 
     .panel.panel-success.hidden 
      .panel-body.alert-success 
      Duis scelerisque id ipsum et consectetur. 
     - when :low 
     .panel.panel-success.hidden 
      .panel-body.alert-success 
      Duis scelerisque id ipsum et consectetur. 
     - when :medium 
     .panel.panel-warning 
      .panel-body.alert-warning 
      Duis scelerisque id ipsum et consectetur. 
     - when :high 
     .panel.panel-info.hidden 
      .panel-body.alert-info 
      Additional information is required: 
    - if @assessment.form_required? 
    .panel.panel-success 
     .panel-heading 
     .panel-title Description of Work 
     .panel-body 
     = f.text_area :aims_hypothesis, label: "Aims/Hypothesis", rows: 4 
     = f.text_area :methodology, label: "Brief Description of Methodology", rows: 4 
     = f.text_area :significance, rows: 4 

... 

    = f.form_group do 
    = f.submit "Save" 

、ありますが、

before_action :find_project 
    before_action :find_assessment 
    before_action :authorised? 

    def next_question 
    @assessment.update_attributes(strong_parameters) 
    respond_to do |format| 
     format :html { redirect_to sign_in_path } 
     format :js do 
     render partial: "update_assessments" 
     end 
    end 
    end 

：なし newアクション）ここで

.row 
    #assessment-form.col-xs-12.col-md-11 
    = render partial: "form" 

はassessments_controller.rbの関連部分ません

そして_update_assessments.js.coffee：

$('#assessment-form').html("<%= escape_javascript (render partial: 'form') %>") 

Answer 1

私はあなたの考え方が有効だと思うし、そうあなたはAJAXを使用する必要があります。

だけ追加してのonChangeハンドラあなたのラジオボタンに、あなたがちょうど頼むの詳細が必要な場合はAJAXポスト

$(document).on('change', '.your-class-or-id-of-the-radio', function() { 
    var element = $(this); // if you need some data from radio button 
    $.ajax({ 
    type: 'POST', 
    url: '/path/to/your/controller', 
    data: {data: 'you need to pass'} 
    }); 
}); 

を開始します。