CODEWITHSUNDEEP
ruby-on-railsruby-on-rails-4
Darkstarone
Darkstarone

Reputation: 4730

Rails select 'Other' option creating text field

Given a standard select code:

<%= f.select :type_name, [['Genomics','Genomics'],['Proteomics','Proteomics'],['Transcriptomics','Transcriptomics'],['Other','Other'] %>

Can someone explain how I would go about creating a text field when 'Other' is selected? So that the type_name can be something other than the options in the select?

I realise this is a simple question, but I haven't found a concise answer as of yet!

Upvotes: 0

Views: 4069

Answers (2)

MikeS
MikeS

Reputation: 117

You need to create an attr_accessor on the model f is attached to (like type_name_other), add a text_field to the form below the select for type_name_other in a div that is initially hidden (in CSS: display:none), then create a javascript listener that detects when the select form has changed and if the selected ansser is "other" show the hidden field else hide it. You will then need to see if type_name_other has a value when processing the form and use it if so.

Upvotes: 0

James Mason
James Mason

Reputation: 4296

There are lots of ways to do this, but they all require JavaScript. The general approach I like is to put a hidden text field in the form, then attach a JavaScript event handler to the select tag that shows the field when the "Other" option is selected.

Here's a gist of the script I typically use for this. It handles the JavaScript binding using data attributes. Add the script to your assets, then put something like this in your form:

<%= f.select :type_name, [['Genomics','Genomics'],['Proteomics','Proteomics'],['Transcriptomics','Transcriptomics'],['Other','Other'] %>
<%= f.text_field :type_name_other, "data-depends-on" => "#object_type_name", "data-depends-on-value" => "Other" %>

where #object_type_name is the HTML id of your dropdown.

Upvotes: 4

Related Questions