Сортировка Выберите поле с помощью jQuery

Question

У меня есть поле выбора на форме, которое содержит атрибут атрибута rel.У меня есть функция, которая может сортировать параметры по значению .text () в алфавитном порядке.

Мой вопрос, с jQuery, как сортировать в порядке возрастания, используя атрибут rel?

<option rel="1" value="ASHCHRC">Ashchurch for Tewkesbury </option>
<option rel="2" value="EVESHAM">Evesham </option>
<option rel="3" value="CHLTNHM">Cheltenham Spa </option>
<option rel="4" value="PERSHOR">Pershore </option>
<option rel="5" value="HONYBRN">Honeybourne </option>
<option rel="6" value="MINMARS">Moreton-in-Marsh </option>
<option rel="7" value="GLOSTER">Gloucester </option>
<option rel="8" value="GTMLVRN">Great Malvern </option>
<option rel="9" value="MLVRNLK">Malvern Link </option>

моя функция сортировки: var object;может быть одним из множества полей выбора в форме.

$(object).each(function() {

    // Keep track of the selected option.
    var selectedValue = $(this).val();

    // sort it out
    $(this).html($("option", $(this)).sort(function(a, b) { 
        return a.text == b.text ? 0 : a.text < b.text ? -1 : 1 
    }));

    // Select one option.
    $(this).val(selectedValue);

});

Answer 1

Если вы хотите отсортировать по rel, вы должны изменить свою функцию

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

редактировать с помощью parseInt ()

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

Answer 2

Для дальнейшего использования принятый ответ не является полным, если option содержит данные или реквизиты (например, .prop('selected', true)). Они будут удалены после использования .html().

Функция ниже, вероятно, не оптимизирована, но она работает правильно:

$.fn.sortChildren = function(selector, sortFunc) {
    $(this)
    .children(selector)
    .detach()
    .sort(sortFunc)
    .appendTo($(this));
};

$('select').sortChildren('option', function(a, b) {
    // sort impl
});

Answer 3

Вы можете использовать функцию .attr (), чтобы получить значение атрибута в jQuery. См. http://api.jquery.com/attr/ для получения дополнительной информации.

Попробуйте это:

$(object).each(function() {

    // Keep track of the selected option.
   var selectedValue = $(this).val();

   // sort it out
   $(this).html($("option", $(this)).sort(function(a, b) {
       var aRel = $(a).attr("rel");
       var bRel = $(b).attr("rel");
       return aRel == bRel ? 0 : aRel < bRel ? -1 : 1 
   }));

   // Select one option.
   $(this).val(selectedValue);

});

Answer 4

Мне нужно было подобное решение, затем я внес некоторые изменения в исходную функцию, и она работала нормально.

function NASort(a, b) {  
    return (a.innerHTML.toLowerCase() > b.innerHTML.toLowerCase()) ? 1 : -1;
};

$('select option').sort(NASort).appendTo('select');

Answer 5

Попробуйте это.

        $(document).ready(function()
        {
            var myarray=new Array();               
            $("select option").each(function()
            {
                myarray.push({value:this.value, optiontext:$(this).text()});
            });

            myarray.sort(sortfun);
            $newHmtl="";
            for(var i=0;i<myarray.length;i++)
            {

                $newHmtl+="<option rel='1' value='"+myarray[i]['value']+"'>"+myarray[i]['optiontext']+"</option>";
            }
            $("select").html($newHmtl);
        });            


        function sortfun(a,b) 
        {
            a = a['value'];
            b = b['value'];                
            return a == b ? 0 : (a < b ? -1 : 1)
        }