Jquery ui Ember.js jQuery UI可排序

我正在玩Ember，我正在尝试使用jQueryUISortable。以下是我在ember之前使用的代码，它运行得很好：

$("ul.photo_list").sortable({
axis: 'x, y',
dropOnEmpty: false,
//handle: '.handle',
cursor: 'crosshair',
items: 'li',
opacity: 0.9,
scroll: true,
update: function(){
  $.ajax({
    type: 'post',
    data: $(".photo_list").sortable('serialize'),
    dataType: 'script',
    complete: function(request){
    },
    url: '/admin/projects/photos/sort})
  }
});

现在，对于Ember，我有以下代码，但它将未定义的数据发送到服务器：

// Project Model
App.Project = Ember.Object.extend({
  _id: '',
  title: '',
  info: '',
  testimonial: '',
  type: '',
  created_at: '',
  updated_at: '',
  photos: [],
  available_types: [
    {value: 'landscape', name: 'Landscape', selected: false},
    {value: 'remodel', name: 'Remodel', selected: true},
    {value: 'new', name: 'New', selected: false}
  ],
  formattedDate: function () {
    return (new Date(this.get("created_at"))).toDateString();
  }.property("created_at"),
  formattedType: function () {
    return this.get("type").charAt(0).toUpperCase() + this.get("type").slice(1);
  }.property("type"),
  isPhotos: function () {
    var photos = this.get("photos");
    if (photos.length > 0) {
      return true;
    } else {
      return false;
    }
  }.property("photos")
});

App.currentProject = App.Project.create();

// Project Controller
App.projectsController = SC.ArrayController.create({
  content: [],
  loadProject: function(id) {
    var self = this;
    $.ajax({
      url: '/admin/projects/' + id,
      dataType: 'json',
      success: function(data) {
        if (data.photos) {
          data.photos = data.photos.map(function(photo) {
            return {
              _id: photo._id,
              photo: photo.photo,
              position: photo.position,
              thumb_url: '/assets/thumb_' + photo.photo,
              large_url: '/assets/large_' + photo.photo
            };
          });

        } else {
          data.photos = [];
        }
        App.currentProject.setProperties(data);
      },
      error: function() {
        console.log('Error')
      }
    });
  },
  createProjectFromJSON: function(json) {
    return App.Project.create(json);
  }
});

// View
App.ProjectView = Ember.View.extend({
  templateName: "projectShow",
  isPhotosBinding: "App.currentProject.isPhotos",
  photosBinding: "App.currentProject.photos",
  projects: function() {
    if (App.projectPagination.page <= 1) {
      Ember.routes.set('location', '!/projects');
    } else {
      Ember.routes.set('location', '!/projects?page=' + App.projectPagination.page);
    }
  },
  newProject: function() {
    Ember.routes.set('location', '!/projects/new');
    App.Router.project_new();
  },
  editProject: function() {
    App.currentProject.set('isEditing', true);
    return false;
  },
  didInsertElement: function() {
    console.log(App.currentProject.photos);
    this._super();
    this.$().sortable({
      items: 'li',
      opacity: 0.85,
      update: function(){
        console.log(App.currentProject.get('photos'));
        $.ajax({
          type: 'post',
          data: $("ul.photo_list").sortable('serialize'),
          dataType: 'script',
          complete: function(request){
          },
        url: '/admin/projects/' + App.currentProject._id + '/photos/sort'})
      }
    });
  }
});

//项目模型
App.Project=Ember.Object.extend({
_id:“”，
标题：“”，
信息：“”，
证明：''，
类型：“”，
在以下位置创建了\u：“”，
更新地址：''，
照片：[]，
可用类型：[
{value:'scanner'，name:'scanner'，selected:false}，
{value:'remodel'，name:'remodel'，selected:true}，
{value:'new'，name:'new'，selected:false}
],
formattedDate:函数（）{
return（新日期（this.get（“created_at”））.toDateString（）；
}.财产（“创建于”），
formattedType:函数（）{
返回this.get（“type”）.charAt（0.toUpperCase（）+this.get（“type”）.slice（1）；
}.物业（“类型”），
isPhotos:函数（）{
var photos=this.get（“photos”）；
如果（照片长度>0）{
返回true；
}否则{
返回false；
}
}.物业（“照片”）
});
App.currentProject=App.Project.create（）；
//项目控制员
App.projectsController=SC.ArrayController.create({
内容：[]，
loadProject:函数（id）{
var self=这个；
$.ajax({
url:'/admin/projects/'+id，
数据类型：“json”，
成功：功能（数据）{
如果（数据、照片）{
data.photos=data.photos.map（函数（照片）{
返回{
_身份证：照片，
照片：photo.photo，
位置：photo.position，
thumb_url:'/assets/thumb_'+photo.photo，
大url:'/assets/large.'+photo.photo
};
});
}否则{
data.photos=[]；
}
App.currentProject.setProperties（数据）；
},
错误：函数（）{
console.log（'错误'）
}
});
},
createProjectFromJSON:函数（json）{
返回App.Project.create（json）；
}
});
//看法
App.ProjectView=Ember.View.extend({
templateName:“projectShow”，
isPhotosBinding:“App.currentProject.isPhotos”，
photosBinding:“App.currentProject.photos”，
项目：职能（）{
if（App.projectPagination.page在运行循环结束时安排ajax调用。这样您就知道DOM已经更新了

Ember.run.schedule('timers', function () {
    $("ul.photo_list").sortable({
        axis: 'x, y',
        dropOnEmpty: false,
        //handle: '.handle',
        cursor: 'crosshair',
        items: 'li',
        opacity: 0.9,
        scroll: true,

        update: function(){
            $.ajax({
            type: 'post',
            data: $(".photo_list").sortable('serialize'),
            dataType: 'script',
            complete: function(request){
            },
            url: '/admin/projects/photos/sort'
        }
    });
});

在运行循环结束时安排ajax调用，这样您就知道DOM已经更新了

Ember.run.schedule('timers', function () {
    $("ul.photo_list").sortable({
        axis: 'x, y',
        dropOnEmpty: false,
        //handle: '.handle',
        cursor: 'crosshair',
        items: 'li',
        opacity: 0.9,
        scroll: true,

        update: function(){
            $.ajax({
            type: 'post',
            data: $(".photo_list").sortable('serialize'),
            dataType: 'script',
            complete: function(request){
            },
            url: '/admin/projects/photos/sort'
        }
    });
});

我们能看到相关的车把代码吗？你看到了吗？我们能看到相关的车把代码吗？你看到了吗？谢谢！我想出了一个解决方案，但这个更干净。谢谢！我想出了一个解决方案，但这个更干净。