Question

我正在尝试使用socket.io和node.js来允许2个用户同时查看JQuery UI可排序列表。我希望当一个用户进行更改时，两个用户列表都会更新。

以下是我现在所拥有的：

client.js

$("#layerColumn").on( "sortstop", function( event, ui ) {
    // Send new list of layers to everyone
    socket.emit('moveLayers', ui.item.attr('id'), ui.position);
});

socket.on('moveLayer', function(layer, position) {
    $('#'+layer).offset(position);
    $(".layerColumn").sortable( "refreshPositions" );
});

server.js

socket.on('moveLayers', function(layer, position) {
    socket.broadcast.emit('moveLayer', layer, position);
});

这会移动第一个用户列表中的项目，但不会在第二个用户列表上对它们重新排序，它只是将它们放在第一个用户“删除”它们的位置。

有什么想法吗？谢谢！

编辑05/08/2013：

将其移至答案。

如果你知道如何更好地做到这一点，请告诉我，因为我仍然感兴趣。

Answer 1

将编辑移至答案（我希望回答我自己的问题是可以接受的）。

我记得sortable只查看容器中的项目，所以使用jQuery我可以根据数组重新排序对象。

我通过socket.io将sortable作为数组发送，并为第二个用户重新附加了可排序容器中的所有项目。

client.js

$("#layerColumn").on( "sortstop", function( event, ui ) {
    // Send new list of layers to everyone
    socket.emit('moveLayers', $( "#layerColumn" ).sortable( "toArray" ));
});

socket.on('moveLayer', function(layers) {
    console.log(layers);
    $.each(layers, function() {
        $("#"+this).appendTo("#layerColumn");
    });
    $("#layerColumn").sortable( "refresh" );
});

server.js

socket.on('moveLayers', function(layers) {
    socket.broadcast.emit('moveLayer', layers);
});

希望这能够帮助遇到类似问题的其他人。

如果你知道如何更好地做到这一点，请告诉我，因为我仍然感兴趣。

关于索引更改的Jquery UI可排序重新排序列表

1 个答案: