Databases
StackOverflow2013
Postsdbo
POhow to get data from server in backbone
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POhow to get data from server in backbone
    text
    copied!<p>I am creating an app in backbone. This current code works but now I want to get the data from the server. My method at /myfriends/getData returns a json of friends name and etc. How can I make this code to get that json from the server. I read up a little and they are using routes etc…I just need to use it on one page of my app so I do not want to do a lot of routing etc</p> <p>thanks</p> <pre><code>$(function() { FriendList = Backbone.Collection.extend({     initialize: function(){         this.bind("add", function( model ){             alert("hey");             view.render( model );         })     } }); FriendView = Backbone.View.extend({     tagName: 'li',     events: {         'click #add-input':  'getFriend',     },     initialize: function() {         this.friendslist = new FriendList;         _.bindAll(this, 'render');     },     getFriend: function() {         var friend_name = $('#input').val();         this.friendslist.add( {name: friend_name} );     },     render: function( model ) {         $("#friends-list").append("&lt;li&gt;"+ model.get("name")+"&lt;/li&gt;");         console.log('rendered')     }, }); var view = new FriendView({el: 'body'}); }); </code></pre> <p>here is a working copy</p> <p><a href="http://jsfiddle.net/thomas/Yqk5A/" rel="nofollow">http://jsfiddle.net/thomas/Yqk5A/</a></p> <p>thanks</p> <p><strong>TIRED</strong></p> <p>this is what I have to show the data and tried after the suggestion and still no luck</p> <pre><code>$(function() { FriendList = Backbone.Collection.extend({     initialize: function(){         this.bind("add", function( model ){             alert("hey");             view.render( model );         })     } }); FriendsServer = new Backbone.Collection({ initialize: function(){ url : '/friends/Data', this.bind("test", function( model ){ view.render( model ); }) } }); FriendView = Backbone.View.extend({     tagName: 'li',     events: {         'click #add-input':  'getFriend',     },     initialize: function() {         this.friendslist = new FriendList;         _.bindAll(this, 'render');     },     getFriend: function() {         var friend_name = $('#input').val();         this.friendslist.add( {name: friend_name} );     },     render: function( model ) {         $("#friends-list").append("&lt;li&gt;"+ model.get("name")+"&lt;/li&gt;");         console.log('rendered')     }, }); FriendsServerView = Backbone.View.extend({ tagName: 'div', render: function( model ){ $("#jsonData").html(FriendServer.fetch); } }); var view = new FriendView({el: 'body'}); var view = new FriendsServerView({el: 'body'}); }); in my html I have a div to populate with json data </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload