JQuery error in wrong order

if (cinemaValue == "maxima") {
     if (dayValue=="mon" || dayValue=="tue" || dayValue=="wed" || dayValue=="thu" || dayValue=="fri") {
         var timeByDay = {"na":"--- Select a time ---", 6:"6pm", 9:"9pm"};
     } else if (dayValue=="sat" || dayValue=="sun") {
         var timeByDay = {"na":"--- Select a time ---", 3:"3pm",6:"6pm", 9:"9pm"};
    }
}
$.each(timeByDay, function(value, text){
    $("#time").append(new Option(text, value));
})

      

I am trying to add timeByDay to a dropdown that is empty. I was expecting to get the data in a dropdown with order (--- select time ---, 6pm, 9pm). However, in my result --- select time --- always appears as the last child in the list, for example (6pm, 9pm, --- select time ---).

Does anyone know the problem?

+3


source to share


1 answer


You need to create an array. You are currently using an object that does not guarantee the order of the keys.

Modify the object as

 var timeByDay = [{
     text: "--- Select a time ---",
     value: "na"
 }, {
     text: "6pm",
     value: "6"
 }];

      



And then use it to populate the select.

$.each(timeByDay, function(index, item){
   $("#time").append(new Option(item.text, item.value));
})

      

DEMO

+2


source







All Articles