Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I use an ajax call to get a array of objects from a php script; however, I'm not able to get the nested objects from it.

Here is what the openings object looks like:

Object
2014-01-11: Array[5]
   0: Object
      appointments: "0"
      name: "0"
      openings: "1"
      route_date: "2014-01-11"
__proto__: Object
1: Object
2: Object
3: Object
4: Object
length: 5
__proto__: Array[0]
2014-01-12: Array[5]
2014-01-13: Array[5]
2014-01-14: Array[5]
2014-01-15: Array[5]
2014-01-16: Array[5]
2014-01-17: Array[5]
2014-01-18: Array[5]



length; undefined appointment.js?ver=3.8:58
begin: 20140111 appointment.js?ver=3.8:59
end: 20140228

I have tried to use console.log("length; "+openings.length); to get the length of the original object returned, but it returns undefined.

Here is my code for the php function:

    function get_available_times()
{
    global $wpdb; 

    $begin = $_REQUEST['begin'];
    $end = $_REQUEST['end']; 
    /*get time slots*/
    $query = "
        SELECT DISTINCT routes.route_date, time_slots.name, time_slots.openings, time_slots.appointments
        FROM routes
        INNER JOIN time_slots ON routes.route_id = time_slots.route_id
        WHERE route_date
        BETWEEN {$begin}
        AND {$end}
        ORDER BY route_date, name
        "; 
    $time_slots = $wpdb->get_results($query);

    /*organize slots into array*/
    $openings = array(); 
    foreach($time_slots as $ts)
    {
        if(empty($openings))
        {
            $openings[$ts->route_date][$ts->name] = $ts; 
        }
        elseif (array_key_exists($ts->route_date, $openings)) 
        {
            $openings[$ts->route_date][$ts->name]=$ts; 
        }
        else
        {
            $openings[$ts->route_date][$ts->name] = $ts; 
        }
    }

    /*return results*/
    $result['openings'] = $openings; 
    $result['time'] = $time_slots;  
    $result['begin'] = $begin; 
    $result['end'] = $end; 
    $result['query'] = $query; 
    $result['type'] = "success"; 
    $result = json_encode($result);
    echo $result;
    die(); 
}

Here is the Javascript code I'm using:

$.ajax({
            type: "post",
            dataType: "json",
            url: ajaxurl, 
            data:{action: "get_available_times", begin: begin, end:end},
            success: function(response){
                if(response.type == "success"){
                    console.log("testing"); 
                    var openings = response.openings;
                    console.dir(openings);
                    console.log("length; "+openings.length); 
                    console.log("begin: "+response.begin);
                    console.log("end: "+response.end);


                }
            }
        });

The point of all this is that I want to be able to iterate through each of the dates and put values into HTML.

share|improve this question
    
Do you only want the dates? –  Johan Jan 11 at 11:28
    
No, I want the value of the name value for each object in the date object, if that makes sense. For each of the days I need to put all the objects name values into the DOM. –  Blaine Jan 11 at 11:30
    
@ArunPJohny that doesn't effect what I'm doing. And it doesn't work. What you say isn't correct –  Blaine Jan 11 at 11:31
    
@Blaine sorry looks like I misread it... –  Arun P Johny Jan 11 at 11:36
    
though the begin and end are variables holding some other key –  Arun P Johny Jan 11 at 11:36
show 1 more comment

1 Answer

Well, it looks like you're getting an object with 5 properties formatted as a date, each with its own array value.

So, try something like this:

var refDate = new Date(2014, 01, 14);

$.each(response.openings, function(k, opening){

    var parts = k.split('-'), //split the date key
        date = new Date(parts[2], (parts[1] - 1), parts[0]); //parse it do a date

    // jump to next iteration if dates doesn't match
    if(refDate.getTime() !=== date.getTime()) return true;

    $.each(opening, function(k2, v){
        console.log(v.name);
    });
});

You should be able to map the values in to a custom result as well. This would give you all the names:

var result = $.map(response.openings, function(v){
     return $.map(v, function(v2){
         return { name: v2.name };
     });
});
console.log(result);
share|improve this answer
    
You are right in the structure. That is EXACTLY what I was looking for! Thank you for your help! –  Blaine Jan 11 at 11:35
    
@Blaine Glad to help. I will add another solution that you might find useful in a sec. –  Johan Jan 11 at 11:36
    
Great! How would I get a specific set of dates. Say I wanted to get all the values for 20140114. How can I grab that object so I can iterate as you have in the second loop>? –  Blaine Jan 11 at 11:40
    
@Blaine Are you taling about the route_date or the date keys? –  Johan Jan 11 at 11:44
    
I would want to get the date keys. When I created the array, I made it an associative array, with the thought that I would be using an array in JS, but that doesn't seem to be the case, so I'm a bit lost on how to get all the object for a particular date (date keys) –  Blaine Jan 11 at 11:46
show 4 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.