Всем привет!
Изучаю связку Django + Backbone.
Тривиальная задача - забрать json-объект по url и распарсить его на клиенте, использую backbone. Для простоты, я пока не использую django-tastypie и прочие штику.
views.py:
def getSample(request):
sample_data = [ { "id": "12345", "firstname": "Peter", "lastname": "Brduch", "age": 24 } ]
res = {"models": sample_data}
json_obj = json.dumps(res)
return HttpResponse(json_obj)
urls.py
urlpatterns = patterns('',
...
url( r"^test/", getSample, name="getSample" ),
url(r"^media/(?P<path>.*)$", "django.views.static.serve", {"document_root": settings.MEDIA_ROOT}),
)
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
шаблон index.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="csrf-token" content="{{csrf_token}}">
<link rel="shortcut icon" href="{{STATIC_URL}}img/favicon.ico">
<title>Test</title>
<link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
<link href="{{ STATIC_URL }}css/custom.css" rel="stylesheet">
<script type="text/template" id="user-list-template">
<table class="table">
<tbody>
<% _.each(users, function(user) { %>
<tr>
<td><%= user.get("firstname") %></td>
<td><%= user.get("lastname") %></td>
<td><%= user.get("age") %></td>
</tr>
<% }) %>
</tbody>
</table>
</script>
<script src="{{ STATIC_URL }}js/jquery-2.1.1.min.js"></script><!-- v2.1.1 -->
<script src="{{ STATIC_URL }}js/underscore-min.js"></script><!-- v1.6.0 -->
<script src="{{ STATIC_URL }}js/backbone-min.js"></script><!-- v1.1.2 -->
</head>
<body>
<div id="main_container">
<div class="container">
<h1>Test</h1>
<hr>
<div class="content"></div>
</div>
<div id="error_block"></div>
<div id="success_block"></div>
</div>
<script type="text/javascript" src="{{ STATIC_URL }}js/main.js"></script>
</body>
</html>
<!-- EOF -->
main.js
$.ajaxPrefilter( function( options, originalOptions, jqXHR ) {
options.url = 'localhost:8000' + options.url;
});
var Users = Backbone.Collection.extend({
url: "/test"
});
var UserList = Backbone.View.extend({
el: ".content",
render: function() {
var that = this;
var users = new Users();
console.log(users);
users.fetch({
success: function() {
console.log("SUCCESS!!!");
var template = _.template( $("#user-list-template").html(), {users: users.models} );
that.$el.html(template);
},
error: function() {
console.log("ERROR!!!");
}
});
}
});
var Router = Backbone.Router.extend({
routes: {
"" : "home"
}
});
var userlist = new UserList();
var router = new Router();
router.on('route:home', function() {
userlist.render();
});
Backbone.history.start();
Делаю:
$ curl localhost:8000/test/
Получаю OK:
{"models": [{ "id": "12345", "firstname": "Peter", "lastname": "Brduch", "age": 24 }]}
Но через Джангу не работает. В консоле пишет:
Object { length: 0, models: Array[0], _byId: Object } main.js:148
"ERROR!!!"
Подскажите, как корректно выполнить задачу? Что я делаю не так? Может у кого есть пример приложения Django + backbone?
Заранее спасибо.