Drop down Select with Images in Option in Backbone.js template

Question

I am trying to show images in Dropdown options in Backbone template. Each option will have image in it. I have tried different ways of doing this but couldn't succeed. Can anyone let me know correct way of doing this.

Here is code i am trying:

         <div class="optionWrapper">
            <select id="<%= id %>" class="extra_option">
              <% _.each(options, function (opt) { %>
                <option value="1" <img src="<? echo $uploads;?>option_thumbnails/<%= opt.thumbnail_file %>">></option> 
              <% }); %>                      
            </select>
         </div>

You need to use custom select for this task. With native implementation of select tag it's not a good idea to use `` tag inside of select options. [Here](http://stackoverflow.com/questions/2965971/how-to-add-a-images-in-select-list) a few workarounds. — vvahans, Dec 05 '14 at 19:23
Yes, and one more thing. Your `each` block should be in select tag. — vvahans, Dec 05 '14 at 19:24

score 0 · Answer 1 · answered Dec 05 '14 at 21:47

0

   <div class="optionWrapper">
            <select id=<%= id %> class="extra_option">
              <% _.each(options, function (opt) { %>
                <option value="1" <img src="<? echo $uploads;?>option_thumbnails/<%= opt.thumbnail_file %>>></option> 
              <% }); %>                      
            </select>
         </div>

Try without the doublequote around your template part (<%=id> and <%= opt.thumbnail_file %>)

answered Dec 05 '14 at 21:47

François Richard

6,817
10
43
78

No that's not the problem. – Mohsin Rafi Dec 06 '14 at 10:22
And also around your php code. +"option_thumbnails/"+<%= opt.thumbnail_file %>> – François Richard Dec 06 '14 at 23:14

Drop down Select with Images in Option in Backbone.js template

1 Answers1