Syntax Error in Json while fetching in backbone.js

Question

I am trying to fetch the data from the JSON, and trying to display it. While fetching the json, it is throwing error in fetch. I am stuck at this point from so many days, and after reading from google, I am confused. Can anyone please help me out what is the error and how to proceed.

<!DOCTYPE html>
<html>
     <head>
  <title>Fortified Studio</title>
 </head>
 <body>test

  <div id="profiles"></div>

        <script id="profileTemplate" type="text/template">
            <div class="profile">
                <div class="info">
                    <div class="name">
                        <%= name %>
                    </div>

                </div>
            </div>
        </script>
  </body>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>   
<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
    <script>
    $(function() {
        console.log("start of script");
    var Prof = Backbone.Model.extend({});
    var ProfList= Backbone.Collection.extend ({
    model: Prof,
    url : '/data/testjson2.json'

    }); 
    var ProfView = Backbone.View.extend ({

        initialize: function (){
            console.log("View initialize");
            this.render();
        },
        render : function (){
            console.log("in render");
            template: _.template($('#profileTemplate').html()),
            _.each (this.collection, function(Prof) {
                var profileTemplate = this.template(Prof.toJSON());
                $(this.el).append(profileTemplate);
            }, this);
            console.log (this);
            return this;
        }


    });


 var profs = new ProfList ();
 var profViews = new ProfView ();
  new ProfList().fetch({
      sucess : function(){
          console.log('json loaded');
      },
      error: function (){
            console.log("error retrieving model");
      }

  });

     profViews.render();
  }); 




    </script>

</html>

and my JSON is:-

[
    {
        "name": "Johny Johny",          
    },
    {
        "name": "Jack n Jill",
    }
]

and output on console is:-

.......
Unknown property 'box-sizing'.  Declaration dropped.               myFile.html
"start of script"                                                 myFile.html:27
"View initialize"                                                 myFile.html:37
"in render"                                                       myFile.html:41
[object Object]                                                   myFile.html:47
"in render"                                                       myFile.html:41
[object Object]                                                   myFile.html:47
 GET /data/testjson2.json        [HTTP/1.1 200 OK 3ms]
syntax error                                                      testjson2.json:1
 "error retrieving model"                                          myFile.html:62

Please help me out, how to proceed.

the console log is unrelated to the problem you're describing. What error is it actually throwing? Oh, wait, there are several messages. Fixed formatting. — John Dvorak
– John Dvorak, Commented Jan 10, 2014 at 12:18
Your JSON is valid. Most likely the server is sending something else as well? — John Dvorak
– John Dvorak, Commented Jan 10, 2014 at 12:21

Toby · Accepted Answer · 2014-01-10 12:22:05Z

1

Remove the commas at the end of each value set.

[
  {
    "name":"Johny Johny"
  },
  {
    "name":"Jack n Jill"
  }
]

Test your JSON with: http://jsonformatter.curiousconcept.com/

answered Jan 10, 2014 at 12:22

Toby

1,6812 gold badges19 silver badges31 bronze badges

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

1 Comment

user3170424 Over a year ago

@Jan dvorak: actually my motive is o fetch the data from json, and display. While fetching instead of throwing success, it is throwing error msg. Moreover, I am not sure how can I print it on front end. My second doubt is 'why [object, object] is getting printed as it should print the value frm json?'

Collectives™ on Stack Overflow

Syntax Error in Json while fetching in backbone.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related