Je suis de la création d'un os à nu le squelette exemple pour essayer de l'apprendre et je rencontre des problèmes à obtenir mon point de vue pour le rendu. Je l'ai basé sur Thomas Davis tutoriel mais regardé de nombreuses autres applications et tutoriels disponibles.
Je vais changer Davis tutoriel pas seulement parce que je veux ajouter une zone de saisie, mais aussi parce que fondée sur l'épine dorsale docs que j'ai pensé qu'il fallait moins de code et une structure différente. Bien sûr, parce que je ne peux pas obtenir que cela fonctionne, je ne sais pas ce qui est nécessaire et ce qui ne l'est pas.
Mon but ultime était de simplement ajouter les noms en li balises ul#friends-list, bien que je ne pense pas qu' el: 'body' va m'aider.
Ce que je fais mal? Merci pour toute aide.
Mon code html:
<!DOCTYPE HTML>
<html>
<head>
<title>Tut</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.4/underscore-min.js"></script>
<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/backbone.js/0.3.3/backbone-min.js"></script>
</head>
<body>
<input type="text" placeholder="Enter friend's name" id="input" />
<button id="add-input">Add Friend</button>
<ul id="friends-list">
</ul>
<script type="text/javascript" src="test.js"></script>
</body>
</html>
Mon test.js
$(function() {
Friend = Backbone.Model.extend();
//Create my model
var friends = new Friend([ {name: 'Eddard Stark'}, {name: 'Robert Baratheon'} ]);
//Create new models to be used as examples
FriendList = Backbone.Collection.extend({
model: Friend
});
//Create my collection
var friendslist = new FriendList;
//Created to hold my friends model
FriendView = Backbone.View.extend({
tagName: 'li',
events: {
'click #add-input': 'getFriend',
},
initialize: function() {
_.bindAll(this, 'render');
},
getFriend: function() {
var friend_name = $('#input').val();
var friend_model = new Friend({name: friend_name});
},
render: function() {
console.log('rendered')
},
});
var view = new FriendView({el: 'body'});
});
