Sorting options by value using Jquery

Question

I'm trying to sort the options by value in selectbox. Sorting is fine by using the below code.But i have option value null, it goes to bottom which should be at top.

$(this).html($("option", $(this)).sort(function(a, b) { 
    var arel = parseInt($(a).attr('value'), 10);
    var brel = parseInt($(b).attr('value'), 10);
    return arel == brel ? 0 : arel < brel ? -1 : 1 
}));

Source: Sorting Select box with jQuery

Actual Result:

<select name="option[285]">
<option value="298">Blazing Yellow</option>
<option value="299">Jet Black</option>
<option value="300">Tabacco Brown</option>
<option value="301">Optical White</option>
<option value="302">Fiery Red </option>
<option value="" selected="selected"> --- Please Select --- </option>
</select>

Expected Result:

<select name="option[285]">
<option value="" selected="selected"> --- Please Select --- </option>
<option value="298">Blazing Yellow</option>
<option value="299">Jet Black</option>
<option value="300">Tabacco Brown</option>
<option value="301">Optical White</option>
<option value="302">Fiery Red </option>
</select>

Arun P Johny · Accepted Answer · 2013-07-27 13:24:17Z

3

The problem seems to be that parseInt('') given NaN which when compared using arel < brel gives wrong result

$(this).html($("option", $(this)).sort(function(a, b) { 
    var arel = parseInt($(a).attr('value'), 10) || 0;
    var brel = parseInt($(b).attr('value'), 10)|| 0;
    return arel == brel ? 0 : arel < brel ? -1 : 1 
}));

Demo: Fiddle

answered Jul 27, 2013 at 13:24

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

Collectives™ on Stack Overflow

Sorting options by value using Jquery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related