2

我正在尝试在 Ext JS 4 中实现一个可排序的列表。几乎与以下示例完全相同:

http://jqueryui.com/sortable/

我知道可以使用网格拖放插件创建一个网格面板,这与此近似。但是,与上面的 jQuery UI 示例不同的是,该示例具有视觉上的糖果,例如当您在它们上方拖动时,项目会移开,并且实际看到您正在拖动的项目(网格拖放插件仅向您展示如何您拖动的许多行)。

Ext JS 中是否已经存在类似的东西?如果没有,解决此问题的最佳方法是什么?

4

2 回答 2

0

看看这个自定义的 D&D 示例,它可能不是您想要的,但它是一个很好的起点: http://docs.sencha.com/extjs/4.2.1/extjs-build/examples/dd/dragdropzones。 html

于 2013-06-14T17:28:20.980 回答
0

仅使用普通<ul>的并在其上实例化HTML5sortable可能更容易。Rubaxa Sortable 与 CSS 无关,可以与其他库很好地配合使用。

new Sortable(document.getElementsByClassName('sortable')[0]);
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<!-- Sortable -->
<script src="https://rawgit.com/RubaXa/Sortable/master/Sortable.js"></script>

<ul class="list-group sortable">
  <li class="list-group-item">This is <a href="http://rubaxa.github.io/Sortable/">Sortable</a></li>
  <li class="list-group-item">It works with Bootstrap...</li>
  <li class="list-group-item">...out of the box.</li>
  <li class="list-group-item">It has support for touch devices.</li>
  <li class="list-group-item">Just drag some elements around.</li>
</ul>

于 2014-12-02T10:09:29.803 回答