Prepend for options but not for first one

JavaScript
1

https://jsfiddle.net/a7ycrsz0/

I try to make this but not append for first “hey” option?

Something with .not() but not want to do what I want.

With older jQuery works with .not('eq:0'); but the 3.4.1 only support .eq(n).

Any idea?

Thanks!

1 Like
2

You were on the right track but you added too much.

When using jQuery and chaining it helps to say to yourself what you want to do step by step and search the option that allows you to do that for each step.

For example:

  • “I want to select the element” - $('select')
  • Then I want to find the options - .find('option')
  • But I do not want the first element - .not(':first-child')
  • And for the rest I preprend what I want - .prepend('Choose category: ')

And with that put together, you get your solution:

$('select')
  .find('option')
  .not(':first-child')
  .prepend('Choose category: ')
4 Likes
3

You answer is really fine. Just now got that when use optgroup that that case the first one as first-child not will got that append text.

You have any idea for this?

https://jsfiddle.net/ytovw8dc/

For still display on optgroup first options too? Is something with :first but that also removed from 3.4.1.

Thanks!

4

If I understood correctly when using <optgroup> it should also prepend the text.

You could do the following:

const options = $('select option')

options
  .not(options[0])
  .prepend('Choose category:&#32;');

Which is the same as saying “I want to get all the options but, I don’t want the first one ( the 0 )”

Edit: Alternatively only using jQuery:

const options = $('select option')

option
  .not(options.first())
  .prepend('Choose category:&#32;');
1 Like
5

You are a pro! Thank you so much!!!

1 Like
6

Thanks so much for this breakdown! There is so much deliciously efficient shorthand … that I wrestle with figuring out :face_with_monocle:

1 Like