How to sort div elements according to div id from a given list/array?

Question

I have the sorting order in a variable.

   var sortorder = "Amazon,Soap,Drugstore,Walmart,Walgreens".split(',');

and my requirement is that it should be arranged in the above given order and if some div's id is not available in the array then it should be appended in the last. The code below is ordering data in the order but the problem is if the div id doesn't exist in the array then it's not moving that div to the last.

HTML

    <div class="wtb_results_online right_results wtb_results_online_results_vantage">
      <div class="results">
            <h3><span>Online Retailers</span></h3>
            <div class="result_item result_innerdv" id="axyz"><span class="year">axyz</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
            <div class="result_item result_innerdv" id="Drugstore"><span     class="year">Drugstore</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
            <div class="result_item result_innerdv" id="Walgreens"><span class="year">Walgreens</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
            <div class="result_item result_innerdv" id="flipcart"><span     class="year">flipcart</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
            <div class="result_item result_innerdv" id="Amazon"><span class="year">Amazon</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
            <div class="result_item result_innerdv" id="Walmart"><span class="year">Walmart</span><a class="btn_pack_sizes" href="javascript:void(0);"></a></div>
         </div>
    </div>

jQuery

  var sortorder = "Amazon,Soap,Drugstore,Walmart,Walgreens".split(',');

    $.each(function(index,value){
        $('.wtb_results_online_results_vantage .result').append($('.wtb_results_online_results_vantage .result'));

    });
    $('.wtb_results_online_results_vantage .results > div').each(function(){
        if($.inArray($(this).attr('id'), sortorder)==-1){
            $('.wtb_results_online_results_vantage .results').append($('.wtb_results_online_results_vantage .results'));
        }
    });

you are missing single quotes here }).appendTo($('#container));, correct it to }).appendTo($('#container')); — Bhushan Kawadkar
– Bhushan Kawadkar, Commented Sep 15, 2014 at 5:39
actly the code is working, what i want is the item which is not in the array list should comes at the last aftr soring. — SHAURAJ SINGH
– SHAURAJ SINGH, Commented Sep 15, 2014 at 5:45

Linga · Accepted Answer · 2014-09-15 06:21:35Z

5

Simply try this

$.each(sortorder,function(index,value){
    if($.inArray(value, sortorder)!==-1){
        $('#container').append($('#'+value));
    }
});

$('#container div').each(function(){
    if($.inArray($(this).attr('id'), sortorder)==-1){
        // inArray will return -1, if the element was not found in array
        $('#container').append($('#'+$(this).attr('id')));
    }
});

Updated Fiddle

Edit: Updated Fiddle

edited Sep 15, 2014 at 6:21

answered Sep 15, 2014 at 5:40

Linga

10.6k10 gold badges57 silver badges109 bronze badges

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

4 Comments

Bhushan Kawadkar Over a year ago

but those which are not present in sortorder are coming to the top and not to the last. see this

SHAURAJ SINGH Over a year ago

actly the code is working, what i want is the item which is not in the array list should comes at the last aftr soring.i have checked thsi in fiddle bt if u add any div which id is not thr in the array den its not showing the result

SHAURAJ SINGH Over a year ago

i can see its working let me ckh in my real time code..thanks a lot.:)

Bhushan Kawadkar Over a year ago

@ling.s, now it is working as expected by OP. Thanks :)

Collectives™ on Stack Overflow

How to sort div elements according to div id from a given list/array?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related