EmberJS + jqueryUI +可排序

时间:2012-07-20 12:18:56

标签: javascript jquery jquery-ui ember.js jquery-ui-sortable

我想在emberjs和jqueryui中创建一个包含一些可排序项的列表(或表)。

我在JSFiddle上传了一个示例:http://jsfiddle.net/KCxxu/

当我启动它并单击删除它完美无缺。但是,当我第一次重新排序项目并再次点击删除时,没有任何反应,直到我点击两个删除按钮。

有什么想法吗?

非常感谢!

1 个答案:

答案 0 :(得分:2)

你的del函数中的

添加contentWillChange()contentDidChange()

似乎现在正在工作

window.App = Ember.Application.create({});

Item = Ember.Object.extend({
    id : null,
    name : null
});

App.listController = Ember.ArrayProxy.create({
    content : [
        Item.create({id: 1, name : 'test'}),
        Item.create({id: 1, name : 'test2'}),
    ],
});

App.ListView = Ember.View.extend({
    tagName : 'tr',

    didInsertElement : function() {
        var me = this;
        this._super();

        // Make list sortable
        this.$().parent("tbody").sortable({
            items : 'tr',
            opacity : 0.6,
            axis : 'y'
        });
    },

    del : function(event) {
        var item = event.context;
        App.listController.contentWillChange();
        App.listController.removeObject(item);
        App.listController.contentDidChange();
    }
});

http://jsfiddle.net/KCxxu/3/