sparkbox / custom-selectbox Goto Github PK

When a select element has no options, an error will be thrown upon page load: Uncaught TypeError: Cannot read property 'innerHTML' of undefined (on jquery.sparkbox-select.js:13).

Hi,

Thank you for the plugin, so far it worked really well. However I have found out few difficulties when using multiple custom selects. The behaviour gets quite strange. Arrows UP and DOWN do not work properly.

It could be also good to have only one dropdown-menu opened in one time. So when you click to second one the first one which is opened gets closed.

myfail

If within options there is same words it gets class .selected try example below and you'll see that both first options will be selected.

<select class="sparkbox-custom">
    <option value="the_googs">Chrome</option>
    <option value="the_faris">Chrome Safari</option>
    <option value="foxfire">Firefox</option>
    <option value="the_splora">IE 9</option>
  </select>

I've noticed an annoying bug with this great script. I'm using a regular layout (container, content div) and if I insert an image tag in HTML, above the

See this screenshot for further info. Is there a workaround or bugfix available for this?

Format:

I have 3 options in my select...
First one has no link...
Second and third has different links...

But using onchange="location.href = this.value;" at tag...
Things just got crazy... I can´t even load the webpage because somehow, when page loads...
Select catchs the first option text as a link.

Can you help me, please?

Thanks.

I've noticed an annoying bug with this great script. I'm using a regular layout (container, content div) and if I insert an image tag in HTML, above the FORM html element which includes the sparkbox dropdowns, the dropdown starts at the wrong position. Even if I remove all HTML and just insert an IMG tag above the FORM it acts this way.

See this screenshot for further info. Is there a workaround or bugfix available for this?

Format:

.live() is a deprecated function (from 1.7+) and removed completely from jQuery 1.9+.

You can instead use .on() or .bind() methods:

http://api.jquery.com/on/
http://api.jquery.com/bind/

The sub-nav appears below other elements in IE7 but works fine in the other major browsers (Firefox, Chrome, Safari, IE8).

When you try and use jquery to change the selected item (such as a reset button) nothing happens. Sparkbox seems to break something. Even the underlying select lists do not change.

I have tested my functions with sparkbox on and off. Works when off but is broken when sparkbox is on

reproduce by trying to set the value of a select list while using sparkbox $("select#elementid").val('a value')

If I insert a dropdown with jQuery after the page is loaded - the dropdown breaks. The styled dropdown is seen, and the source shows that it populated the ul, but the click functionality is broken and doesn't work at all.

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.

Showing error for the following drop down
<select name="data[Album][album_date][day]" class="sparkbox-custom">
<option value="">DD</option>
<option value="01">1</option>
<option value="02">2</option>
</select>

If the key is 1, 2 it is working... Otherwise it is showing error "Uncaught TypeError: Cannot set property 'selected' of undefined" on jquery.sparkbox-select.js at line 35

When I resize the page, the sub-menu doesn't take the new "left" values.

Is it normal?

Hi,
First - thanks for great plugin it really helped me.

There is a problem when using multiple select boxes specially one under another.
Drop down block wont hide when you click on another select box without choosing an option in first one.
Also in that situation z-index is an issue as the second select box is displayed over drop down block of the first one.
Here's a quick and dirty fix i've used to deal with this:

var viewList = function(e) {
    var $this = $(this);
    clear();
++  $('.sb-dropdown').fadeOut('fast');
    $this.closest('.sb-custom').find('.sb-dropdown').fadeIn('fast');
++  $('.sb-dropdown').css("z-index","99");
++  $this.closest('.sb-custom').find('.sb-dropdown').css("z-index","100");
    e.preventDefault();
};

After this fix you can encounter an problem with flashing drop down after making selection. I still don't know how to fix it.
For now i've just deleted focus binding for drop down.

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

'select your state
Alabama
Alaska
Arizona
Arkansas
California
Colorado
Connecticut
Delaware
District of Columbia
Florida
Georgia
Hawaii
Idaho
Illinois
Indiana
Iowa
Kansas
Kentucky
Louisiana
Maine
Maryland
Massachusetts
Michigan
Minnesota
Mississippi
Missouri
Montana
Nebraska
Nevada
New Hampshire
New Jersey
New Mexico
New York
North Carolina
North Dakota
Ohio
Oklahoma
Oregon
Pennsylvania
Rhode Island
South Carolina
South Dakota
Tennessee
Texas
Utah
Vermont
Virginia
Washington
West Virginia
Wisconsin
Wyoming
--------------
PROVINCES
Alberta
British Columbia
Manitoba
New Brunswick
New Foundland
Northwest Territories
Nova Scotia
Ontario
Prince Edward Island
Quebec
Saskatchewan
Yukon
'
$('#state').sbCustomSelect();