Ajax call json undefined Object : object

Question

the json value keeps returning unidentified or it doesnt display at all

PHP CODE

$index=0;

while($row = $result->fetch_array()){

    $index++;
    $data=array(

        array(

            $index=>$row['menuName']
        )

    );


  }

    echo json_encode($data);
}

JQUERY AJAX

<script>
         $(document).ready(function(){
              $.ajax({
                    type: 'GET',
                    data: {loadpage: 'table'},
                    dataType: 'json',
                    url: 'addtable.php',
                    success: function(data){        

                        $('.navbar ul').append('<li><a href="#" class="table">'+data[0]+'</a></li>');
                } 
                }); //ajax request
             });
    </script>

The json is fine it displays in the right format. When i change my jquery to data[0] it displays object Object and if i do data[1 or higher] it gives me undefined. I dont know what im doing wrong i even tried it do this: data[0].1 and it displays nothing.

Any help will be appreciated.

Becuase data[0] is an object not value and u try to print as a value. — devpro
– devpro, Commented Feb 16, 2016 at 2:06
how many values are you expecting anyway? do you only need one value? or rows of values? — Kevin
– Kevin, Commented Feb 16, 2016 at 2:09
i didnt include this but i basically want it to grab data form the database and create a new link everytime i still havent used the $.each function because i was trying to see if the json will output what i wanted. — NaderBesada
– NaderBesada, Commented Feb 16, 2016 at 2:14
The console log actually shows me the value i wanted. But why cant it do that in my example — NaderBesada
– NaderBesada, Commented Feb 16, 2016 at 2:14

Kevin · Accepted Answer · 2016-02-16 02:21:47Z

2

First thing to do is to fix the PHP script part which responds to the request.

Create a valid JSON string response. The simpliest way is first to create a container (an array).

Then second is the to continually push fetched rows in there. Then finally use json_encode in the end.

Don't encode while inside the loop:

Simple example:

// initialize container
$data = array();

// the pushing of rows
while($row = $result->fetch_array()) {
    $data[] = $row; // push the whole row
}

// finally, echo it to into a JSON string
echo json_encode($data);
// don't put me inside the WHILE

PHP Note: If this is mysqli, I'd suggest use the ->fetch_assoc() instead or just simply ->fetch_array(MYSQLI_ASSOC) flag.

In your AJAX script, just handle the response as you normally would:

<script>
 $(document).ready(function(){
      $.ajax({
        type: 'GET',
        data: {loadpage: 'table'},
        dataType: 'json',
        url: 'addtable.php',
        success: function(data){
            // every each row, create an LI element with an anchor
            $.each(data, function(index, element){
                $('.navbar ul').append('<li><a href="#" class="table">'+element.menuName+'</a></li>');
                // just use the column names as the properties in your data response that came from PHP
            });       


        } 
    }); 
});
</script>

If this runs, this should yield something into a markup like this:

<li>
    <a href="#" class="table">Table1</a>
</li>
<li>
    <a href="#" class="table">Table2</a>
</li>
<li>
    <a href="#" class="table">Table4</a>
</li>

edited Feb 16, 2016 at 2:21

answered Feb 16, 2016 at 2:15

Kevin

41.9k12 gold badges57 silver badges72 bronze badges

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

6 Comments

NaderBesada Over a year ago

unfortunately that didnt work. Thanks alot for the help though

Sean Over a year ago

shouldn't the id="table" end up as class="table"?

Kevin Over a year ago

@NaderBesada modify when necessary, use $.each when you're expecting multiple rows and creating the markup that you want in that kind of fashion there's the answer already to guide you through into completing it

NaderBesada Over a year ago

The user enters the menu names in the db. I just need to pull them out and put each menu as a link in my nav bar

Kevin Over a year ago

@NaderBesada then do that, use .val() when needed, put that input inside data: { userinput: blah blah } in your AJAX request, and process the request inside PHP, $userinput = $_GET['userinput'] and so on...

|

Collectives™ on Stack Overflow

Ajax call json undefined Object : object

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related