Jquery sort array using string alphabetical order

Question

I have an array, I want to sort the array using name object alphabetical.

Currently, it is sorting correctly but there is a minor issue.

var arry = [{
    'name': '2.1 Foo',
    'children': [{
        'name': '2.1.1 Foo ',
      },
      {
        'name': '2.1.3 Foo ',
      },
      {
        'name': '2.1.10 Foo ',
      },
      {
        'name': '2.1.2 Foo ',
      },
    ],
  },
  {
    'name': '1.1 Foo',
    'children': [{
        'name': '1.1.2 Foo ',
      },
    ],
  },
];


function SortByName(a, b){
        if(a.children){
            a.children = a.children.sort(SortByName)
        }
        if(b.children){
            b.children = b.children.sort(SortByName)
        }
        var aName = a.name.toLowerCase();
        var bName = b.name.toLowerCase();

        return ((aName < bName) ? -1 : ((aName > bName) ? 1 : 0));
    }
    
    
    $(document).ready(function() {
      var sorted_array = arry.sort(SortByName)
      console.log(sorted_array)
    })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

for above code output is

 [
  {
    "name": "1.1 Foo",
    "children": [
      {
        "name": "1.1.2 Foo "
      }
    ]
  },
  {
    "name": "2.1 Foo",
    "children": [
      {
        "name": "2.1.1 Foo "
      },
      {
        "name": "2.1.10 Foo "    // this is wrong
      },
      {
        "name": "2.1.2 Foo "
      },
      {
        "name": "2.1.3 Foo "
      }
    ]
  }
]

expected op

[
  {
    "name": "1.1 Foo",
    "children": [
      {
        "name": "1.1.2 Foo "
      }
    ]
  },
  {
    "name": "2.1 Foo",
    "children": [
      {
        "name": "2.1.1 Foo "
      },
      {
        "name": "2.1.2 Foo "
      },
      {
        "name": "2.1.3 Foo "
      },
      {
        "name": "2.1.10 Foo "
      }
    ]
  }
]

Does this answer your question? [Sort mixed alpha/numeric array](https://stackoverflow.com/questions/4340227/sort-mixed-alpha-numeric-array) — Simone Rossaini, Jul 13 '20 at 06:22

score 1 · Accepted Answer · answered Jul 13 '20 at 06:54

You need to use a regular expression to eliminate the dots before you compare.

var arry = [
  {
    'name': '2.1 Foo',
    'children': [{
        'name': '2.1.1 Foo ',
      },
      {
        'name': '2.1.3 Foo ',
      },
      {
        'name': '2.1.10 Foo ',
      },
      {
        'name': '2.1.2 Foo ',
      },
    ],
  },
  {
    'name': '1.1 Foo',
    'children': [{
        'name': '1.1.2 Foo ',
      },
    ],
  },
];


function SortByName(a, b){
        if(a.children){
            a.children = a.children.sort(SortByName)
        }
        if(b.children){
            b.children = b.children.sort(SortByName)
        }

        var aName = parseInt( a.name.toLowerCase().replace(/\./g, "") );
        var bName = parseInt( b.name.toLowerCase().replace(/\./g, "") );

        return ((aName < bName) ? -1 : ((aName > bName) ? 1 : 0));
    }
    
    
    $(document).ready(function() {
      var sorted_array = arry.sort(SortByName)
      console.log(sorted_array)
    })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

@c.grey will not work if there is 2 digit number in the 1st 2 places like `10.1.1` or `1.10.1`. Use options in `localeCompare` as mentioned in the duplicate: https://stackoverflow.com/a/38641281/3082296 — adiga, Jul 13 '20 at 13:08

Jquery sort array using string alphabetical order

1 Answers1