LINUX.ORG.RU

Djnago + Backbone

 , , ,


1

1

Всем привет!

Изучаю связку 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?

Заранее спасибо.


А у меня работает.
Вот так делаю:
responce = json.loads(urllib2.urlopen('http://тут-моя-урла?гет-параметры=всякие', urllib.urlencode(пост-параметры)).read().decode('utf8'))

А потом респонс разбираю.

Goury ★★★★★ ()
Ответ на: комментарий от Goury

Вы о чем вообще?

Проблема в том, что я не могу распарсить коллекцию, полученную с сервера, с помощью backbone. Почему-то url (вьюха)не отрабатывается через Джангу.

djnoob ()

вали в Jobs

Но через Джангу не работает. В консоле пишет:
«ERROR!!!»

Мы должны угадать, что это за ошибка? Или отладить твой быдлокод?

anonymous ()
Ответ на: комментарий от djnoob

Об этом:

забрать json-объект по url и распарсить его на клиенте

Хотя может я просто плохо врубился в задачу. Но я так забираю джсоны и с парсингом проблем не возникает потом.

Goury ★★★★★ ()

Backbone
$.ajaxPrefilter

anonymous ()

Content-type за тебя Пушкин будет выставлять?

$.ajaxPrefilter

Но зачем?

heilkitty ★★ ()

Изучай лучше AngularJS, намного больше пользы (потому как упрощает многие операции) и перспектив (потому как тренд роста популярности значительно опережает остальные js-фреймворки).

static_lab ★★★★★ ()

А почему ты зовешь разные урлы?

bj ()

Что я делаю не так?

return HttpResponse(json_obj, mimetype='application/x-javascript')

RedPossum ★★★★★ ()

Ура! Заработало!

Добавил mimetype и

(function() {
var _sync = Backbone.sync;
Backbone.sync = function(method, model, options){
options.beforeSend = function(xhr){
var token = $('meta[name=«csrf-token»]').attr('content');
xhr.setRequestHeader('X-CSRFToken', token);
};
return _sync(method, model, options);
};
})();

djnoob ()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.