使用骨干从asp.net获取数据

时间:2013-06-07 02:07:11

标签: asp.net jquery backbone.js

    $.ajax({
    type: "POST",
    url: "Home.aspx/loadSB",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (msg) {
        for (i = 0; i < msg.d.length; i++) {
            $('#sidebar ul').append('<li class="inactive"><a>' + msg.d[i].Title + ' </a></li>');
        }
    }
});

我经历过这个 https://github.com/kjbekkelund/writings/blob/master/published/understanding-backbone.mdhttps://gist.github.com/ryandotsmith/1655019 教程和创建骨干如下,但由于模型没有从asp.net获取数据,这部分出错了,因此效果不佳?我还是骨干新手

Menu = Backbone.Model.extend({
    parse: function (data) { return data; }
});

MenuCol = Backbone.Collection.extend({
    model: Menu,
    url: "Home.aspx/loadSB",
    parse: function (response) { return response.rows; }
});

MenuView = Backbone.View.extend({
    initialize: function () {
        this.collection.on('add', this.appendMenu, this);
    },
    appendMenu: function (msg) {
        for (i = 0; i < msg.d.length; i++) {
            this.$('ul').append('<li class="inactive"><a>' + msg.d[i].Title + ' </a></li>');
        }
    }
});

 var mc = new MenuCol();
 //mc.fetch();
 //Update1:
 new MenuView({ el: $('#sidebar'), collection: mc });

更新1: 我玩过fetch,但仍然效果不佳,

Menu = Backbone.Model.extend({});

MenuCol = Backbone.Collection.extend({
    model: Menu,
    url: "Home.aspx/loadSB",
});

var test = new MenuCol();
test.fetch();

它没有返回我想要的数据,而是显示我的屏幕所具有的界面 enter image description here

如果我使用没有主干的jquery.ajax,它会将json数据返回给我,哪部分出错了?任何指南都会很棒 enter image description here

更新2:

好的,我改变了“fetch”,现在我能看到json数据传入骨干

var test = new MenuCol();
test.fetch({ type: 'POST', contentType: "application/json; charset=UTF-8" });

1 个答案:

答案 0 :(得分:0)

好的,最后我解决了这个问题,

define(['jquery', 'underscore', 'backbone'], function () {
Menu = Backbone.Model.extend({});

MenuCol = Backbone.Collection.extend({
    model: Menu,
    url: "Home.aspx/loadSB",
});

MenuView = Backbone.View.extend({

    initialize: function () {
        this.collection.on('add', _.bind(this.AppendMenu, this));
    },
    AppendMenu: function (msg) {
        var feed = JSON.parse(JSON.stringify(msg));
        for (var i = 0; i < feed.d.length; i++) {
            this.$('ul').append('<li class="inactive"><a>' + feed.d[i].Title + ' </a></li>');
        }
    }
});

var test = new MenuCol();
test.fetch({ type: 'POST', contentType: "application/json; charset=UTF-8" });
new MenuView({ el: $('#sidebar'), collection: test })

});

通过将获取类型更改为“POST”和contentType:“application / json; charset = UTF-8”,最后我设法使用我想要的数据填充web