Solved

Adapt jQuery Selectbox plugin to add extra class to select list

Posted on 2013-01-08
4
821 Views
Last Modified: 2013-01-08
Hi All,

I'm using a jQuery Selectbox plugin from the following location: http://www.bulgaria-web-developers.com/projects/javascript/selectbox/

It works fine except that I would like to be able to add a class to either the <a> link  or <li> that has been chosen by the user so when the dropdown is opened again, I can have styled that <li> to look like the active selection.

So when the user clicks on a list option, either the <a> or <li> get an additional class of 'selected' or whatever which is then removed when you click on another option.

Any ideas?

Many thanks.
jquery.selectbox-0.2.zip
0
Comment
Question by:b24
  • 2
4 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
Comment Utility
Like most "free" plugins, there does not appear to be any support.  I suggest you try to contact the author, because I doubt anyone is going to try and modify the library for you.

Cd&
0
 
LVL 25

Accepted Solution

by:
Kyle Hamilton earned 500 total points
Comment Utility
You could try something like this. (the onOpen, and onClose you can remove if you want)


$("#selectlist").selectbox({
	onOpen: function (inst) {
		//console.log("open", inst);
	},
	onClose: function (inst) {
		//console.log("close", inst);
	},
	onChange: function (val, inst) {
		$(this).find("option").filter(":selected").addClass("selected");
	},
	effect: "slide"
});

Open in new window

0
 

Author Closing Comment

by:b24
Comment Utility
Thanks kozaiwaniec !
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
Comment Utility
my pleasure :))
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now