0

I have a list that I would like to obtain the values of, then sort it.

I only used a few of the LI's below, the list is actually much, much, larger; the full list contains all of the values in the sortBy below. But I thought it would be better to only list a few for simplicity.

I just have to sort them in the order that's in the JS sortBy. The JS isn't working at all to sort.

No console errors or anything of that nature, just isn't being sorted.

Instead of 6M, 9M, 3M, I want it sorted (for instance) 3M, 6M, 9M, and so on and so forth. Pretty simple concept, I thought it'd be super easy. But turns out it's quite a chore.

Thank you.

Javascript:

    jQuery(document).ready(function() {
        jQuery('ul.linkList').each(function() {
            var sortBy = ['Newborn', '3M', '6M', '9M', '12M', '18M', '24M', '2T', '3T', '4T', '4', '5', '6', '6X', '7', '8', '10', '12', '14', '16', '1 SZ', ' 1 SZ 0-3M', '1 SZ 3M-9M', '1 SZ 9M-24M', '1 SZ 2-4', '1 SZ 4-7', '1 SZ 7-16', 'S', 'M', 'L', 'XL', 'Hide extra values', 'View all'];  //Values to sort by once data is obtained
            var theList = jQuery(this);
            var listItems = theList.children('li').get(); //Get values from LI        
            var numHidden = 0;

            listItems.sort(function(a,b) {
                var indexA = jQuery.trim(jQuery(a).find('a').text());
                var indexB = jQuery.trim(jQuery(b).find('a').text());
                indexA = jQuery.inArray(indexA, sortBy);
                indexB = jQuery.inArray(indexB, sortBy);
                return (indexA < indexB) ? -1 : (indexA > indexB) ? 1 : 0;
            });

            theList.append(listItems);
        });
    });

HTML: 

<ul class="linkList SizeChicklets" id="binValue-2">
      <li class="binValue">
        <input name="binId" value="size_name" type="hidden">         
        <input name="binValue" value="0-3 Months" type="hidden">                       
        <a href=".com/s?field_size_name=0-3+Months&amp;ie=UTF8&amp;refinementHistory=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchBinNameList=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchKeywords=*&amp;searchNodeID=5690131011&amp;searchRank=generic-one-desc-rank&amp;searchSize=12" rel="nofollow">
        <input type="checkbox">
        <span>        6M</span></a>
      </li>
      <li class="binValue">
        <input name="binId" value="size_name" type="hidden">         
        <input name="binValue" value="10" type="hidden">                       
        <a href=".com/s?field_size_name=10&amp;ie=UTF8&amp;refinementHistory=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchBinNameList=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchKeywords=*&amp;searchNodeID=5690131011&amp;searchRank=generic-one-desc-rank&amp;searchSize=12" rel="nofollow">
        <input type="checkbox">
        <span>        9M</span></a>
      </li>
      <li class="binValue">
        <input name="binId" value="size_name" type="hidden">         
        <input name="binValue" value="12" type="hidden">                       
        <a href=".com/s?field_size_name=12&amp;ie=UTF8&amp;refinementHistory=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchBinNameList=subjectbin%2Csize_name%2Cgeneric_text_2-bin%2Cprice%2Cbrandtextbin%2Cgeneric_text_1-bin&amp;searchKeywords=*&amp;searchNodeID=5690131011&amp;searchRank=generic-one-desc-rank&amp;searchSize=12" rel="nofollow">
        <input type="checkbox">
        <span>        3M</span></a>
      </li>
</ul>
James Anderson
  • 815
  • 1
  • 13
  • 23
  • 1
    Short list is better indeed, but can you at least say what is your problem (what is going wrong)? – Regent Sep 11 '14 at 13:33
  • I just have to sort them in the order that's in the JS sortBy. The JS isn't working at all to sort. No console errors or anything of that nature, just isn't being sorted. Instead of 6M, 9M, 3M, I want it sorted (for instance) 3M, 6M, 9M, and so on and so forth. Pretty simple concept, I thought it'd be super easy. But turns out it's quite a chore. – James Anderson Sep 11 '14 at 13:35
  • 1
    I haven't examined your code closely, but I'm seeing the elements sorted correctly in Chrome with jQuery 2.1.0: http://jsfiddle.net/49ywz9xh/1/ Am I misunderstanding your problem? Are you asking how to sort them by some other (e.g., more scalable) mechanism? – apsillers Sep 11 '14 at 13:37

1 Answers1

0

Not sure why you are attempting to write your own sort? Take a look at this stackoverflow article. How may I sort a list alphabetically using jQuery?

Community
  • 1
  • 1
Patrick O'Hara
  • 557
  • 1
  • 6
  • 17