make "Other" question option more explicit as an affordance

app/controllers/admin/question_options_controller.rb

@@ -1,5 +1,5 @@
 class Admin::QuestionOptionsController < AdminController
-  before_action :set_question, only: [:new, :create, :show, :edit, :update, :destroy]
+  before_action :set_question, only: [:new, :create, :create_other, :show, :edit, :update, :destroy]
   before_action :set_question_option, only: [:show, :edit, :update, :destroy]
 
   def index
@@ -41,6 +41,10 @@ def create
 
     if text_array.length > 0
       text_array.each do | txt |
+        if (txt.upcase == 'OTHER' || txt.upcase == 'OTRO')
+          @errors << "Use add #{txt} button"
+          next
+        end
         question_option = QuestionOption.where(question_id: params[:question_id], text: txt).first
         if question_option
           @errors << "Question option already exists for text #{txt}"
@@ -71,6 +75,18 @@ def create
    render :create, format: :js
   end
 
+  def create_other
+    @errors = []
+    question_option = QuestionOption.new()
+    question_option.position = @question.question_options.size + 1
+    question_option.question_id = @question.id
+    question_option.text = "Other"
+    question_option.value = "OTHER"
+    question_option.save!
+    @question_options = [ question_option ]
+    render :create, format: :js
+  end
+
   def update
     @question_option.update(question_option_params)
     render :update, format: :js

app/views/components/forms/edit/_builder.html.erb

@@ -293,6 +293,11 @@ $(function() {
     });
   });
 
+  $('.form-builder').on("click", '.form-add-other-question-option', function(event) {
+    event.preventDefault();
+    $(this).closest('div.new-question-options-div').find('.form-add-other-question-option').hide();
+  });
+
   $('.question').on("click", ".edit.button", function(event) {
     event.preventDefault();
     var contentDiv =  $(this).closest('.question-option');

app/views/components/forms/edit/question_types/_checkbox.html.erb

@@ -13,4 +13,10 @@
     <i class="fa fa-plus"></i>
     Add Checkbox Option
   <% end %>
+  <% if !question.question_options.detect{ | option | option.value.upcase == 'OTHER' || option.value.upcase == 'OTRO'} %>
+    <%= link_to create_other_admin_form_question_question_options_path(question.form, question),method: :post, remote: true, class: "usa-button usa-button--outline form-add-other-question-option" do %>
+      <i class="fa fa-plus"></i>
+      Add Other Option
+    <% end %>
+  <% end %>
 </div>

app/views/components/forms/edit/question_types/_checkbox_option.html.erb

@@ -5,6 +5,7 @@
     <%= render 'components/forms/edit/question_types/update_value_text_fields', { question: question, option: option } %>
   <% end %>
   <% if ["OTHER", "OTRO"].include?(option.text.upcase) %>
+    <%= label_tag(nil, for: "#{question.answer_field}_other", class: "usa-input__label") do %><%= t 'form.enter_other_text' %><% end %>
     <input type="text" name="<%= question.answer_field %>_other" id="<%= question.answer_field %>_other" data-option-id="<%= option.id %>" placeholder="<%= t 'form.enter_other_text' %>" class="usa-input other-option" />
     <br/>
   <% end %>

app/views/components/forms/edit/question_types/_radio_button_option.html.erb

@@ -5,6 +5,7 @@
     <%= render 'components/forms/edit/question_types/update_value_text_fields', { question: question, option: option } %>
   <% end %>
   <% if ["OTHER", "OTRO"].include?(option.text.upcase) %>
+    <%= label_tag(nil, for: "#{question.answer_field}_other", class: "usa-input__label") do %><%= t 'form.enter_other_text' %><% end %>
     <input type="text" name="<%= question.answer_field %>_other" id="<%= question.answer_field %>_other" data-option-id="<%= option.id %>" placeholder="<%= t 'form.enter_other_text' %>" class="usa-input other-option" />
     <br/>
   <% end %>

app/views/components/forms/edit/question_types/_radio_buttons.html.erb

@@ -13,4 +13,10 @@
     <i class="fa fa-plus"></i>
     Add Radio Button Option
   <% end %>
+  <% if !question.question_options.detect{ | option | option.value.upcase == 'OTHER' || option.value.upcase == 'OTRO'} %>
+    <%= link_to create_other_admin_form_question_question_options_path(question.form, question),method: :post, remote: true, class: "usa-button usa-button--outline form-add-other-question-option" do %>
+      <i class="fa fa-plus"></i>
+      Add Other Option
+    <% end %>
+  <% end %>
 </div>

app/views/components/forms/question_types/_checkbox.html.erb

@@ -8,6 +8,7 @@
       <%= check_box_tag(@option_id, option.value, false, { name: question.answer_field, multiple: true, class: "usa-checkbox__input usa-checkbox__input--tile", required: question.is_required }) %>
       <%= label_tag(nil, for: @option_id, class: "usa-checkbox__label") do %><%= option.text %><% end %>
       <% if ["OTHER", "OTRO"].include?(option.text.upcase) %>
+        <%= label_tag(nil, for: "#{question.answer_field}_other", class: "usa-input__label") do %><%= t 'form.enter_other_text' %><% end %>
         <input type="text" name="<%= question.answer_field %>_other" id="<%= question.answer_field %>_other" data-option-id="<%= @option_id %>" placeholder="<%= t 'form.enter_other_text' %>" class="usa-input other-option" />
         <br/>
       <% end %>

app/views/components/forms/question_types/_radio_buttons.html.erb

@@ -8,6 +8,7 @@
       <%= radio_button_tag(@option_id, option.value, nil, { id: @option_id, name: question.answer_field, class: "usa-radio__input usa-radio__input--tile", required: question.is_required  }) %>
       <%= label_tag(@option_id, nil, class: "usa-radio__label") do %><%= option.text %><% end %>
       <% if ["OTHER", "OTRO"].include?(option.text.upcase) %>
+        <%= label_tag(nil, for: "#{question.answer_field}_other", class: "usa-input__label") do %><%= t 'form.enter_other_text' %><% end %>
         <input type="text" name="<%= question.answer_field %>_other" id="<%= question.answer_field %>_other" data-option-id="<%= @option_id %>" placeholder="<%= t 'form.enter_other_text' %>" class="usa-input other-option" />
         <br/>
       <% end %>

app/views/components/widget/_fba.js.erb

@@ -507,6 +507,7 @@ function FBAform(d, N) {
 			var params = {
 			<%# Dynamically write the Form parameters for Custom Forms %>
 			<% form.questions.each do |question| %>
+			    <% next unless question_type_javascript_params(question).present? %>
 				<%= question.answer_field %>:
 				<%= raw question_type_javascript_params(question) %>,
 			<% end %>

config/routes.rb

@@ -207,6 +207,9 @@
         end
         resources :question_options, except: [:index, :show] do
           patch "update_title", to: "question_options#update_title", as: :inline_update
+          collection do
+            post "create_other", to: "question_options#create_other", as: :create_other
+          end
         end
         collection do
           patch "sort", to: "questions#sort", as: :sort_questions

spec/features/embedded_touchpoints_spec.rb

@@ -31,7 +31,7 @@
           click_on "Next"
 
           expect(page).to have_content("Option elements")
-          find("#question_option_4 label").click
+          find("#question_option_4 .usa-radio__label").click
           fill_in("answer_04_other", with: "otro 2")
 
           all('.usa-checkbox__label').each do |z|; z.click; end