Getting 'undefined' while accessing array inside object in javascript

Question

I am trying to access time from given date.

Here is HTML

<input type="date" name="fromdate" id="fromdate" onchange="displaytimefromdate(this.value)" />
<div id="timepicker"></div>

Here is Javascript Code:

    var availableTime = {"2014-07-18":["Friday, 02:02:00 - 00:00:00","Friday, 01:01:00 - 01:01:00"],"2014-07-19":["Saturday, 02:02:00 - 00:00:00","Saturday, 01:01:00 - 01:01:00"],"2014-07-20":["Sunday, 02:02:00 - 00:00:00","Sunday, 01:01:00 - 01:01:00"]};

function displaytimefromdate(timefromdate) {
        jQuery('#timepicker').html('<div class="form-group"><div class="radio"><label><input class="form-control input-lg bg-darkBlue fg-white" type="radio" id="timepicker" name="timepicker" /></label>'+availableTime.timefromdate+'</div></div>');
}

Here is JsFiddle :- http://jsfiddle.net/rW73e/

Help would be appreciated.

Thanks

j809 · Accepted Answer · 2014-07-06 09:48:02Z

1

Take a look here:

http://jsfiddle.net/rW73e/2/

I have given a direct string value to timefromdate.

So,

availableTime[timefromdate];

works fine. It has no problem.

Your date object keys are limited to 2 or 3 values which you have included in the availableTime, which map directly to the time. Other dates are not mapped.

If you select other dates which are not present in the availableTime object, it will surely return undefined.

answered Jul 6, 2014 at 9:48

j809

1,4991 gold badge12 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

gramgram · Accepted Answer · 2014-07-06 09:51:37Z

With bracket notation it's working, however the the object you try to access defined as array.

var availableTime = {"2014-07-18":["Friday, 02:02:00 - 00:00:00","Friday, 01:01:00 - 01:01:00"],"2014-07-19":["Saturday, 02:02:00 - 00:00:00","Saturday, 01:01:00 - 01:01:00"],"2014-07-20":["Sunday, 02:02:00 - 00:00:00","Sunday, 01:01:00 - 01:01:00"]};

function displaytimefromdate(timefromdate) {
    jQuery('#timepicker').html('<div class="form-group"><div class="radio"><label><input class="form-control input-lg bg-darkBlue fg-white" type="radio" id="timepicker" name="timepicker" /></label>'+availableTime[timefromdate]+'</div></div>');
}

http://jsfiddle.net/rW73e/3/

If you want to use the entire block, you should rearrange the object as:

var availableTime = {"2014-07-18":["Friday, 02:02:00 - 00:00:00, Friday, 01:01:00 - 01:01:00"],"2014-07-19":["Saturday, 02:02:00 - 00:00:00, Saturday, 01:01:00 - 01:01:00"],"2014-07-20":["Sunday, 02:02:00 - 00:00:00, Sunday, 01:01:00 - 01:01:00"]};

http://jsfiddle.net/rW73e/4/

... or access the value within the array:

function displaytimefromdate(timefromdate) {
        jQuery('#timepicker').html('<div class="form-group"><div class="radio"><label><input class="form-control input-lg bg-darkBlue fg-white" type="radio" id="timepicker" name="timepicker" /></label>'+availableTime[timefromdate][0]+'</div></div>');

http://jsfiddle.net/rW73e/5/

Guy G · Accepted Answer · 2014-07-06 09:32:58Z

0

If I understand correctly you are trying to get a value from your json object.

Try:

availableTime[timefromdate]

instead of:

availableTime.timefromdate

Hope this helps

answered Jul 6, 2014 at 9:32

Guy G

996 bronze badges

1 Comment

StrekoZ Over a year ago

availableTime - is a map where "2014-07-18" is a key and a value is array. If you select date whitch doesn't exists in this map - you will always get "Undefined". Select some date whitch exists in your availableTime

Collectives™ on Stack Overflow

Getting 'undefined' while accessing array inside object in javascript

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related