Sort options in a HTML select-tag without javascript

Question

I was wondering if it is possible to sort options in a html select tag with using HTML and CSS only.

So given following snippet:

<select>
    <option>c</option>
    <option>b</option>
    <option>a</option>
</select>

I want the browser to show those items in following order:

a
b
c

Using javascript, or worse hoping that those elements will come pre-sorted just feels so wrong :)

thx

I don't think this is possible. If you have access to the server side, sorting them before submitting is definitely the way to go. — Emanuel Oster
– Emanuel Oster, Commented Apr 27, 2016 at 11:13

Community · Accepted Answer · 2017-05-23 12:16:00Z

6

Unfortunately NO! In html you can just code the things and in css you can style elements but cannot remove and save or shuffle the positions. There is no supported property in css or html to do so.

Using javascript is the only solution for it.

Further if you decide to do it with javascript then you may refer this Sort an html list with javascript

edited May 23, 2017 at 12:16

CommunityBot

11 silver badge

answered Apr 27, 2016 at 11:14

Gaurav Aggarwal

10.2k8 gold badges42 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Gaurav Aggarwal Over a year ago

You have to use javascript for some things which are not possible in css or html there is not problem in using for these cases. Go ahead with javascript dude. :)

pmkrefeld Over a year ago

Technically not a problem, but it would be just awesome if I could specify this really simple feature directly in the tag or using a css class ;(

Gaurav Aggarwal Over a year ago

i understand..do u really want to do it in select box or it's just a example.?

pmkrefeld Over a year ago

It is an actual case I am trying to implement as cleanly as possible and was just wondering why everyone on the net is apparently using 30-40 lines of code to achieve this :)

Collectives™ on Stack Overflow

Sort options in a HTML select-tag without javascript

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related