Errors with selection & drop-down "search" feature.

thecoastisclear commented 12 years ago

Gang - good work on this plugin, however there are some very fatal flaws that are preventing me from using it. I hope my etiquette is proper here, as I've never used github before.

FIrst off - the latest mixer version is what seems to be working the best. However, it still doesn't "close" the drop-down if you hit "enter" on an item.

The biggest problem is that in my list, if I chose an item far down in my list, it does not "select" the right one. As in, the proper value will not be displayed.

Below is my list. If I "Saskatchewan", for example, my custom-selectbox will show "Hawaii" for some reason... I can't get the following to show up as html. Github keeps parsing it... blaaaah

'

          <option value="AK">Alaska</option>
          <option value="AZ">Arizona</option>
          <option value="AR">Arkansas</option>
          <option value="CA">California</option>
          <option value="CO">Colorado</option>
          <option value="CT">Connecticut</option>
          <option value="DE">Delaware</option>
          <option value="DC">District of Columbia</option>
          <option value="FL">Florida</option>
          <option value="GA">Georgia</option>
          <option value="HI">Hawaii</option>
          <option value="ID">Idaho</option>
          <option value="IL">Illinois</option>
          <option value="IN">Indiana</option>
          <option value="IA">Iowa</option>
          <option value="KS">Kansas</option>
          <option value="KY">Kentucky</option>
          <option value="LA">Louisiana</option>
          <option value="ME">Maine</option>
          <option value="MD">Maryland</option>
          <option value="MA">Massachusetts</option>
          <option value="MI">Michigan</option>
          <option value="MN">Minnesota</option>
          <option value="MS">Mississippi</option>
          <option value="MO">Missouri</option>
          <option value="MT">Montana</option>
          <option value="NE">Nebraska</option>
          <option value="NV">Nevada</option>
          <option value="NH">New Hampshire</option>
          <option value="NJ">New Jersey</option>
          <option value="NM">New Mexico</option>
          <option value="NY">New York</option>
          <option value="NC">North Carolina</option>
          <option value="ND">North Dakota</option>
          <option value="OH">Ohio</option>
          <option value="OK">Oklahoma</option>
          <option value="OR">Oregon</option>
          <option value="PA">Pennsylvania</option>
          <option value="RI">Rhode Island</option>
          <option value="SC">South Carolina</option>
          <option value="SD">South Dakota</option>
          <option value="TN">Tennessee</option>
          <option value="TX">Texas</option>
          <option value="UT">Utah</option>
          <option value="VT">Vermont</option>
          <option value="VA">Virginia</option>
          <option value="WA">Washington</option>
          <option value="WV">West Virginia</option>
          <option value="WI">Wisconsin</option>
          <option value="WY">Wyoming</option>
          <option>-------------- </option>
          <option>PROVINCES</option>
          <option value="AK">Alberta</option>
          <option value="AZ">British Columbia</option>
          <option value="AR">Manitoba</option>
          <option value="CA">New Brunswick</option>
          <option value="CO">New Foundland</option>
          <option value="CT">Northwest Territories</option>
          <option value="DE">Nova Scotia</option>
          <option value="DC">Ontario</option>
          <option value="FL">Prince Edward Island</option>
          <option value="GA">Quebec</option>
          <option value="HI">Saskatchewan</option>
          <option value="HI">Yukon</option>
  </select>'

$('#state').sbCustomSelect();

cstickel commented 12 years ago

Can you write an example html file? It's hard to reproduce the problem with just the options contents. What are the values, the css, etc.

thecoastisclear commented 12 years ago

Absolutely, how do I get it to you?

cstickel commented 12 years ago

http://pastebin.com/ would be a possibility. alternatively just upload it to a webserver.

EDIT: oh and please tell me in which browser (and version) you experienced the buggy behavior.

thecoastisclear commented 12 years ago

Here's the link:

http://pastebin.com/raw.php?i=0ChGS6yB

I included the CSS inline. It may not look perfect, but it's the functionality that's not working quite right. This happens in every browser on my Mac (Chrome, FF, & Safari), as well as at least Chrome and FF on my Windows PC. All the latest versions as I religiously keep them updated. If you need exact versions I can look, but I really think that part is irrelevant as the issue is so wide-spread.

cstickel commented 12 years ago

Okey, there are two bugs:

Selectbox doesn't seem to work with jquery 1.7 (input doesn't show the value and keyboard navigation doesn't work at all. Items at far bottom aren't selectable)
Selecting an item which you've to scroll to doesn't get selected

I'll try to fix both bugs tomorrow morning. The secound bug doesn't seem to be the one you experienced, since you've set a fixed height and get a scrollbar in the dropdown, which works.

Can you please try your example after changing the jquery source to the outdated 1.5 version: http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js Just to check if you still experience bugs i haven't found.

I have to get some sleep now, but i'll fix the jquery 1.7 bug as soon as i get up.

thecoastisclear commented 12 years ago

Ahh, I see both the bugs you mentioned.

The problem I was referring to about it not selecting the right one was partly my error. The Canadian province checkboxes used the same value as some of the US states (from copying the option tags), and because of that the plugin chooses the first option with the selected matching value. If someone has a select box with multiple options that have the same value, this plugin will always select the first of the matching value. I hope that makes sense...

cstickel commented 12 years ago

If you use the version from https://github.com/mixer2/Custom-Selectbox exactly the clicked item should get selected. If it doesn't something is totally wrong.

thecoastisclear commented 12 years ago

Ahh, you are correct. This version does not have that issue.

cstickel commented 12 years ago

Nice, then the 2 identified bugs are all to fix. I'll leave you a comment here as soon as the updated version is available.

cstickel commented 12 years ago

hi, both bugs should be fixed in https://github.com/mixer2/Custom-Selectbox i suggest you use that version, until changes are pulled to the main repository.

first bug with jQuery version (added compatibility for current jquery version, dropped compatibility for versions < 1.6): https://github.com/mixer2/Custom-Selectbox/commit/d75fb7b2a6ecf668f2a6ac12cdfe678ecfaf437e

secound bug (can't select an item with long dropdowns, if you scroll to a position where the select isn't visible anymore in webkit browsers): https://github.com/mixer2/Custom-Selectbox/commit/97578c8c4ba8e7670cad651e5cd7cceaaa8b19eb

sparkbox / Custom-Selectbox

Errors with selection & drop-down "search" feature. #13