How to sort values in my json object

Question

I would like to sort "years" in yearObject of type Object so the menu starts with 2016 instead of 2013. Please help. Example of code is provided here.

My HTML:

<form name="myform" id="myForm">
            <select name="optone" id="yearSel" size="1">
                <option value="" selected="selected">Select Year</option>
            </select>
            <br>
            <br>
            <select name="opttwo" id="stateSel" size="1">
                <option value="" selected="selected">Please select year first</option>
            </select>
            <br>
            <br>
            <select name="optthree" id="citySel" size="1" citySel.onchange = function();>
            <option value="" selected="selected">Please select state first</option>
        </select>
    </form>

My JS:

var yearObject = {
    "2016": {
        "California": ["Los Angeles", "San Francisco"],
        "Florida": ["Orlando", "Miami"],
        "New York": ["Manhattan","Brooklyn"]
    },
    "2015": {
        "California": ["Los Angeles", "San Francisco"],
        "Florida": ["Orlando", "Miami"],
        "New York": ["Manhattan","Brooklyn"]
    },
    "2014": {
        "California": ["Los Angeles", "San Francisco"],
        "Florida": ["Orlando", "Miami"],
        "New York": ["Manhattan","Brooklyn"]
    },
    "2013": {
        "California": ["Los Angeles", "San Francisco"],
        "Florida": ["Orlando", "Miami"],
        "New York": ["Manhattan","Brooklyn"]
    }
 }
window.onload = function () {
    var yearSel = document.getElementById("yearSel"),
        stateSel = document.getElementById("stateSel"),
        citySel = document.getElementById("citySel");
    for (var year in yearObject) {
        yearSel.options[yearSel.options.length] = new Option(year, year);
    }
    yearSel.onchange = function () {
        stateSel.length = 1; // remove all options bar first
        citySel.length = 1; // remove all options bar first
        if (this.selectedIndex < 1) {
          stateSel.options[0].text = "Please select Year first"
          citySel.options[0].text = "Please select state first"
          return; // done   
        }  
        stateSel.options[0].text = "Please select state"
        for (var state in yearObject[this.value]) {
            stateSel.options[stateSel.options.length] = new Option(state, state);
        }
        if (stateSel.options.length==2) {
          stateSel.selectedIndex=1;
          stateSel.onchange();
        }  

    }
    yearSel.onchange(); // reset in case page is reloaded
    stateSel.onchange = function () {
        citySel.length = 1; // remove all options bar first
        if (this.selectedIndex < 1) {
          citySel.options[0].text = "Please select state first"
          return; // done   
        }  
        citySel.options[0].text = "Please select city"

        var cities = yearObject[yearSel.value][this.value];
        for (var i = 0; i < cities.length; i++) {
            citySel.options[citySel.options.length] = new Option(cities[i], cities[i]);
        }
        if (citySel.options.length==2) {
          citySel.selectedIndex=1;
          citySel.onchange();
        }  

    }
 citySel.onchange = function(){  
    switch(citySel.value){

case "Los Angeles":
       if(yearSel.value == "2016"){
       location.href="http://google.com";
}else if(yearSel.value == "2015","2014"){
       location.href= "http://facebook.com";
    }
break;
case "Miami":
       if(yearSel.value == "2016","2015"){
       location.href="http://google.com";
}else if(yearSel.value == "2014","2013"){
       location.href= "http://facebook.com";
    }
break;
  }
    }
  }

post the code HERE, not just a link to it. and by here, I mean edit your question. don't dump a bunch of code into a comment. — Marc B, Jul 25 '16 at 20:13
Possible duplicate of [Sort JavaScript object by key](http://stackoverflow.com/questions/5467129/sort-javascript-object-by-key) — Orpheus, Jul 25 '16 at 20:16

M.Tanzil · Accepted Answer · 2016-07-25T20:53:46.630

0

You need to create separate array for year and sort it using sort() function in javascript.

var sortable = [];
 for (var year in yearObject) {
    sortable.push(year);
 }
 sortable.sort(function(a, b){return b-a});
 for (var i = 0; i < sortable.length; i++){
  yearSel.options[yearSel.options.length] = new Option(sortable[i], sortable[i]);
}

Have a look at the Fiddle

edited Jul 25 '16 at 20:53

answered Jul 25 '16 at 20:30

M.Tanzil

1,899
1
9
27

do you really sort on every loop? – Nina Scholz Jul 25 '16 at 20:45
@NinaScholz! Sorry should not be like that, i will update my answer. Thanks – M.Tanzil Jul 25 '16 at 20:47
@NinaScholz! Can you suggest a better idea? – Tom C. Jul 25 '16 at 21:21
@TomC. its ok now just a little repetition in loop which was not required, answer and fiddle is updated. – M.Tanzil Jul 25 '16 at 21:23
@TomC. already updated! i just place `sortable.sort(function(a, b){return b-a})` outside the loop, at first it was in loop which was not required, hope you understand :) – M.Tanzil Jul 25 '16 at 21:30
@M.Tanzil. I see now. Thanks a lot. – Tom C. Jul 26 '16 at 14:50

How to sort values in my json object

1 Answers1