Menu
I'ved got a json array and i want to create a dropdown selection list. And because its json, i dont want to display json but based on a readable name.
I tried 2 methods that came the closest, but cant get what i want.
controller:
@books = [{"code"=>"PA1","name"=>"James","type"=>"Novel"},{"code"=>"PA2","name"=>"John","type"=>"Science"}]
form.html.erb:
<%= select "book", "book", @books.each_with_index.map {|name, index| [name,name["name"]]} %>
the generated html:
<select id="book_book" name="book[book]"><option code="PA1" name="James" type="Novel" value="James">James</option>
<option code="PA2" name="John" type="Science" value="John">John</option></select></div>
form.html.erb:
<%= select_tag "book", options_for_select(@books) %>
the generated html:
<select id="book" name="book"><option value="{"code"=>"PA1","name"=>"James", "type"=>"Novel"}">{"code"=>"PA1", "name"=>"James", "type"=>"Novel"}</option><option value="{"code"=>"PA2", "name"=>"John", "type"=>"Science"}">{"code"=>"PA2", "name"=>"John", "type"=>"Science"}</option></select> </div>
Even this does not work, there is 2 different "value"! Getting more frustrated.
@books = [{"value" => {"code"=>"PA1","name"=>"James","type"=>"Novel"}},{"value" => {"code"=>"PA2","name"=>"John","type"=>"Science"}}]
<%= select "book", "book", @books.each_with_index.map {|value, index| [value,value["value"]["name"]]} %></div>
<select id="book_book" name="book[book]"><option value="James" value="{"code"=>"PA1", "name"=>"James", "type"=>"Novel"}">James</option>
<option value="John" value="{"code"=>"PA2", "name"=>"John", "type"=>"Science"}">John</option></select></div>
<select id="book_book" name="book[book]"><option value="{"code"=>"PA1","name"=>"James","type"=>"Novel"}">James</option>
<option value="{"code"=>"PA2","name"=>"John","type"=>"Science"}">John</option></select></div>
676
I’ll first create a JSON array inside a JavaScript function and add few data to it. Next, I’ll iterate (loop) through each value in the array and bind the values to the SELECT element. See how I got the selected text of the SELECT element in the above example.
Here we will populate the dropdown list with an array. Below is the description of popular approaches used in JavaScript. Example 1: In this example, the length property is used to traverse the elements of the array and on each element create an option element and append this new element to the select element by appendChild () method .
In the first example, I’ll create a JSON array using JavaScript and bind the data to a SELECT element. In the second example, I’ll extract data from an External JSON file using XMLHttpRequest Object, parse the JSON and bind the data to the SELECT element. I’ll first create a JSON array inside a JavaScript function and add few data to it.
To make sure that you’ll receive a array you should declare the name of the select with “ [ ]” like that: An :onchange call can be made using the Rails 3 jquery-ujs helper in the form: The jquery_ujs looks for data-remote and data-url. These can be spelled out or placed in the data hash.
I don't know why you wanna pass whole hash as string in value of your <option>
But if you want to generate this
<select id="book_book" name="book[book]"><option value="{"code"=>"PA1","name"=>"James","type"=>"Novel"}">James</option> <option value="{"code"=>"PA2","name"=>"John","type"=>"Science"}">John</option></select></div>
Then you should write following
<%= select("book", "book", @books.each.map {|hash| [hash['name'], hash.to_s] }) %></div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
