Question

我很难让我的jquery可排序列表水平显示。用户可以将报表部件拖到舞台上，然后将列拖放到报表部件上。删除其他列时，div应水平扩展。但我尝试的所有东西总是垂直排序。

您可以在此处查看：http://jsfiddle.net/asleepatmydesk/kNfGC/

当报告控件被放到舞台上时，我正在尝试修改＆lt; ul＆gt;的css。和＆lt; li＆gt;一样：

    $('.stage').droppable({
        accept: '.reportControl',
        tolerance: "fit",
        drop: function (event, ui) {
            var pos = $(ui.helper).offset();
            $(this).append($(ui.helper).clone());
            $('.stage .reportControl').replaceWith(gridControlDropped);

            $('.gridControlDropped')
                .draggable({
                handle: '.filterContainer',
                cursor: 'move',
                containment: '.stage'
            })
            var ul = $('.droppedColumns')
            ul.sortable({
                connectWith: ".connected",
                placeholder: "ui-state-highlight"

            })


        }
    });
      var ul = $('.droppedColumns')   //modifying the ul
            ul.sortable({
            connectWith: ".connected"
            , placeholder: "ui-state-highlight"

      })
       .css({
            'float': 'left'
            , 'display':'inline-block'
           });

          var li = $('.droppedColumns li').css({
               'display': 'inline-block'
       });

但似乎没有任何效果。任何建议将不胜感激。

感谢。

Answer 1

只需将其添加到gridControlDropped类

即可

.gridControlDropped {
 display: inline-block;
}

Jquery可排序水平列表

1 个答案: