2012-10-03 2 views
1

Je crée une application dans backbone. Ce code fonctionne mais maintenant je veux récupérer les données du serveur. Ma méthode à/myfriends/getData renvoie un nom json des amis et etc. Comment puis-je faire ce code pour obtenir ce json du serveur. Je lis un peu et ils utilisent les routes etc ... J'ai juste besoin de l'utiliser sur une page de mon application, donc je ne veux pas faire beaucoup de routage, etcComment obtenir des données du serveur dans le backbone

grâce

$(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("<li>"+ model.get("name")+"</li>"); 
        console.log('rendered') 
    }, 

}); 

var view = new FriendView({el: 'body'}); 
}); 

Voici une copie de travail

http://jsfiddle.net/thomas/Yqk5A/

grâce

FATIGUÉ

c'est ce que je dois montrer les données et essayé après la suggestion et toujours pas de chance

$(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("<li>"+ model.get("name")+"</li>"); 
        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 

Répondre

3

Vous venez de définir la propriété url de votre collection et appelle .fetch() sur votre collection pour charger la les données de votre serveur. Plus d'infos sur:

http://backbonejs.org/#Collection-fetch

Aussi, je lierait vos événements modèle/collection à votre point de vue, pas au modèle/collection.

Questions connexes