Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.customSelectOpen class is not removed as desired #29

Closed
iSimonWeb opened this issue Apr 12, 2013 · 12 comments

Comments

Projects
None yet
2 participants
@iSimonWeb
Copy link

commented Apr 12, 2013

I can't manage to rotate up the arrow near my customSelect when is actually open and rotate down it when s are not visible. To remove the .customSelectOpen I need to click twice...

@adamcoulombe

This comment has been minimized.

Copy link
Owner

commented Apr 12, 2013

This example makes use of the .customSelectOpen class:
http://jsfiddle.net/adamco/gL8gk/

Right now when a user clicks and selects an option as normal it should remove the class on change.

There could be one of two problems though:

  1. If the user opens the select, and then closes it by clicking the select box again without selecting an option. The .customSelectOpen doesnt go away until next blur or change event
  2. The user selects the same option again. The select will close and same result as above.

The first scenario is probably fixable since we could make the customSelectSpan listen for a click to remove the class.

The second secnario is much trickier since there will be no change event or anything to listen for.

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 14, 2013

You got the point. The fix for the first scenario is perfect.
Anyway you miss a third scenario: The user opens the select, and then closes it by clicking anywhere on the page; on first click the select will close but the .customSelectOpen doesn't go away like on first scenario.

p.s. sorry if there are any english mistake, I'm italian and I'm trying to do my best :)
Thank you for the support!

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Can't you listen to 'click' on 'document' to .blur() the <select />? I suppose that could be a good fix.

@adamcoulombe

This comment has been minimized.

Copy link
Owner

commented Apr 16, 2013

Yes, Please check the latest version to see if this solves your issue

patch @ line 108 e794b11#L1R108

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Yes man! "click away" scenario solved! :)
What about a listener on .customSelectInner to blur the <select /> if expanded?

@adamcoulombe

This comment has been minimized.

Copy link
Owner

commented Apr 16, 2013

Was not necessary.... the document listener solves both scenarios. customSelectOpen should go away when you click it but maintain focus. (You do not want to blur the select box when the user clicks it as this would be unexpected behaiour)

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Yeah you right, I'm observing that now via Firebug. .customSelectOpen go away as desired :)
Thank you so much, happy coding!

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Look at these awesome customSelect! http://www.spaghettitours-dev.com/charters
👍

@adamcoulombe

This comment has been minimized.

Copy link
Owner

commented Apr 16, 2013

@iSimonWeb link did not work, would love to see it though

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Lol sry, that's the local address!
Here is the right one http://test.spaghettitours.com/charters

@adamcoulombe

This comment has been minimized.

Copy link
Owner

commented Apr 16, 2013

@iSimonWeb fantastic stuff I like the animation you implemented. great idea

@iSimonWeb

This comment has been minimized.

Copy link
Author

commented Apr 16, 2013

Thank you 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.