vbotio
vbotio

Reputation: 1674

Calling a json and getting an error from Jquery "cannot read property "length" of undefined

As the title says, Im calling a Json and It's "working", but i'm getting an error from jquery. "cannot read property "length" of undefined". I dont know what it could be.

here is my html, js and json

http://jsfiddle.net/vitorboccio/7LUCa/

    <div class="wrapper">
        <div class="profile">
            <table id="userdata" border="2">
                <thead>
                    <th>Name</th>
                    <th>E-mail</th>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>

JS:

$.ajax({
       get: 'people.json',
       success: function (data) {
           alert('it works');
           $.each(data.table, function(i, f) {
               var tblRow = "<tr>" + "<td>" + f.name + "</td>" +
               "<td>" + f.email + "</td>" + "</tr>"
               $(tblRow).appendTo("#userdata tbody");
           });
       },
       error: function() {alert('it doesnt work')},
       datatype: 'jsonp'
    });

update:

error

Upvotes: 0

Views: 104

Answers (2)

dave
dave

Reputation: 64657

You can't use .each on something that doesn't have a length. In your fiddle, at the moment, you are getting back

Object {error: "Please use POST request"} 

for data. Which obviously you can't iterate over the .table property, as it has no length because it is undefined.

Edit:

This works on your actual site:

$.getJSON('http://vitorboccio.com/projects/test/people.json',
   function (data) {
      console.log(data.data);
       $.each(data.data.table, function(i, f) {
           var tblRow = "<tr>" + "<td>" + f.name + "</td>" +
           "<td>" + f.email + "</td>" + "</tr>"
           $(tblRow).appendTo("#userdata tbody");
       });
   }
);

Upvotes: 4

Mark
Mark

Reputation: 4873

You can't use each on the data like that. That is were you are getting the error.

Upvotes: 0

Related Questions