I am not sure if it is possible but I would like to leave the HTML <select>
object expended using JavaScript, JQuery after the selection. Any ideas?
EDIT
What I want is that; if user selects more option from select list, I will append some more options to select element and leave it open. If user selects something other than more option, I will collapse the list. I can get a hold of other functionality but only problem here is to keep the select element open.
It's not possible directly. You'd have to implement something that looked and worked like a native <select>
but which also had the feature you want.
edit — check Mr. Kling's answer; there might be a way to make that work, sort-of.
You could come very close with this:
$('#selectID').change(function(){
$(this).attr('size', $(this).children().length);
});
The size
attribute specifies how many options to display (default is 0
).
DEMO
You might have to make some tests whether this works in every (recent) browser. But imo this would be better than trying to simulate a select box (screen readers, etc).
You can not expand the select element with JavaScript. You can use select multiple, but that is probably not what you want.