0

Let's say I have a list like so:

var list = [{
    title: 'Green',
    data: {
      test: 'world'
    }
  }, {
    title: 'Blue',
    data: {
      test: 'world'
    }
  }, {
    title: 'Red',
    data: {
      test: 'world'
    }
  }];

and I have a simple array like this: var orderList = ['Red', 'Green', 'Blue'].

How would I make it so anytime the list array gets created (and its random) for then for it to be sorted by the order of which orderBy goes? So, if an array item's title is Red... it gets put at top and if it's Green... it goes below the Red object.

Edit: This is NOT sorting A-Z because I want to list it from the order the orderList is on.

The problem happens when the user selected, let's say, Green, well.. it should be first but for some reason, I get null, Green or something like that.

var randomBtn = document.querySelector('.random');
var orderIt = document.querySelector('.orderIt');
var selectedList = document.querySelector('.selectedList');
var orderedList = document.querySelector('.orderedList');

orderIt.addEventListener('click', function(e) {
  orderBy(list);
});


  var list = [{
    title: 'Green',
    data: {
      test: 'world'
    }
  }, {
    title: 'Blue',
    data: {
      test: 'world'
    }
  }];
  
  selectedList.innerHTML = JSON.stringify(list, null, 4)
  var orderList = ['Red', 'Green', 'Blue'];


  var orderBy = function(list) {

    var tempArr = [];
    
    for (var i = 0; i < list.length; i++) {
      var getItem = list.filter(function(e) {
        return e.title === orderList[i];
      })[0];
      tempArr.push(getItem);
    }
    
    orderedList.innerHTML = JSON.stringify(tempArr, null, 4);
    
  }
<button class='orderIt'>Order by Heiarchy</button>
<br /><br />
<pre class='selectedList'></pre>

Ordered List: must always be RED, GREEN, BLUE.
<pre class='orderedList'></pre>
red
  • 305
  • 1
  • 4
  • 15
  • keep questions to only what is relevant... the shuffle vs ordered is confusing. The fact that is already shuffled doesn't seem relevant to what you are asking ... so the shuffle code is irrelevant (I think) – charlietfl Apr 25 '17 at 17:38
  • do you want it ascending or descending? – funcoding Apr 25 '17 at 17:38
  • @funcoding That shouldn't matter because the order is based on the `orderList` so `red`... should always be first... `green` should always be last. – red Apr 25 '17 at 18:16
  • @charlietfl The shuffle is just to shuffle the array for demo purposes. Not realted. The order is what I'd like to finalize. Sorry for confusion. – red Apr 25 '17 at 18:17
  • I thought you want it sort it by the list array? – funcoding Apr 25 '17 at 18:17
  • @funcoding Nope. It needs to sort by whats in order from `orderList` is. So `red` is first...then take whatever object's `title` is red... and make it first... and on and on. – red Apr 25 '17 at 18:19
  • 1
    and that's my point... the shuffle is irrelevant to the problem you are asking about. For better explanation see [mcve] – charlietfl Apr 25 '17 at 18:20
  • @charlietfl Alright, I'll fix this. Give me a minute. – red Apr 25 '17 at 18:23
  • 1
    try this `list.sort((a,b) => orderList.indexOf(a.title) - orderList.indexOf(b.title)); console.log(list)` – charlietfl Apr 25 '17 at 18:32
  • @charlietfl That worked. Whoa. Thank you, charlietfl. I never knew about the `-` in the `sort` function. I'll have to read more about it. I made it waaaay to complicated. – red Apr 25 '17 at 18:39
  • only works for numerical values – charlietfl Apr 25 '17 at 18:40

0 Answers0