rvera / image-picker

Image Picker is a simple jQuery plugin that transforms a select element into a more user friendly graphical interface.
http://rvera.github.com/image-picker
Other
906 stars 216 forks source link

image-picker always selects first image #25

Closed st-keller closed 10 years ago

st-keller commented 10 years ago

Hi if i Initialize image-picker by calling $("select").imagepicker() the first image is always selected.

It would be very cool, if image-picker could keep the selection (third image in this example):

<select class="image-picker show-html">
  <option data-img-src="img/01.png" value="1">  Page 1  </option>
  <option data-img-src="img/02.png" value="2">  Page 2  </option>
  <option data-img-src="img/03.png" value="3" selected>  Page 3  </option>
</select>

How can I achieve this?

st-keller commented 10 years ago

Please close this - works like a charm (i found a bug in my html-code, that caused that behavior).

Great work - Thanks!

rvera commented 10 years ago

I'm glad it's working for you. Let me know if you find any issues with it.

show-html is not really needed though, I only have that to use a separate plugin to display the real HTML of the select element on the doc page.

sean-gilmore commented 4 years ago

For anyone else stumbling upon this issue, you're probably missing the first empty option that should be included in you select, as per the documentation:

<select class="image-picker">
  <option value=""></option>
  <option data-img-src="http://placekitten.com/300/200" value="1">Cute Kitten 1</option>
  <option data-img-src="http://placekitten.com/150/200" value="2">Cute Kitten 2</option>
  <option data-img-src="http://placekitten.com/400/200" value="3">Cute Kitten 3</option>
</select>

The first <option value=""></option> is required to resolve this issue.