fail to get json object in javascript from php

Question

I am trying to pass json string to javascript from php, so at first i did

<div id="picker" data-dates=\''.json_encode(unserialize($a->available_datetime)).'\'></div>

and then, i try to grab it in jquery

if($("#picker").length){
    available = $("#picker").attr("data-dates");
}

However, it seems it then fail to loop through the object to get key and val

$.each(available,function(key,val)
{}

It keep getting error of

var length = !!obj && "length" in obj && obj.length,

Tried for several hours now, cant find a solution to solve. Anyone can help? Thanks.

Answer 1

Use $("#picker").data("dates") it will get the data stored in the attribute data-dates and convert it to JSON, assuming you have a JSON string in that attribute.

Then use:

 for (var i in available) {
      //do something with available[i]
 }

check example: https://jsfiddle.net/fud6sfjo/