Wicket DND - 使用表格放置顶部/底部

使用wicket-dnd，是否可以在HTML表格中使用dropTop()/dropBottom()？如果是这样，选择者应该是什么？Wicket DND - 使用表格放置顶部/底部

我有一个通过ListView创建的HTML表格，并已成功与dropCentre("tr")，但这是唯一可以工作的放置选项。理想情况下，我想使用dropTopAndBottom()并查看表格行之间的水平分隔符，表示放置目标。

更新： 下面是相关的代码，为简洁起见简化。有问题的表格每行都有一个标签并添加到表单中。

// Container class for Wicket DND 
    final WebMarkupContainer dataWrapper = new WebMarkupContainer("dataWrapper"); 
    dataWrapper.add(new WebTheme()); 

    final ListView<BinaryData> data = new ListView<BinaryData>("data", list) { 

     @Override 
     protected void populateItem(final ListItem<BinaryData> item) { 
      final BinaryData data = item.getModelObject(); 
      item.add(new Label("label", data.getLabel())); 
     } 

     @Override 
     protected ListItem<BinaryData> newItem(final int index, final IModel<BinaryData> itemModel) { 
      final ListItem<BinaryData> item = super.newItem(index, itemModel); 
      item.setOutputMarkupId(true); 
      return item; 
     } 
    }; 

    dataWrapper.add(data); 
    dataWrapper.add(new DragSource(Operation.MOVE) { 

     @Override 
     public void onAfterDrop(final AjaxRequestTarget target, final Transfer transfer) { 
     } 
    }.drag("tr")); 

    dataWrapper.add(new DropTarget(Operation.MOVE) { 

     @Override 
     public void onDrop(final AjaxRequestTarget ajaxTarget, final Transfer transfer, final Location location) { 

     } 
    }.dropTopAndBottom("tr")); 

    form.add(dataWrapper);

而且标记：

<div wicket:id="dataWrapper"> 
    <table> 
     <tbody> 
      <tr wicket:id="data"> 
       <td wicket:id="label"></td> 
      </tr> 
     </tbody> 
    </table> 
</div>

我使用Wicket的DND 0.6.0和Wicket 6.6.0。当使用此代码拖动一行时，我会在拖动指示器中显示红色十字图标。

来源

2013-07-27 nullPainter

你举的例子正常工作在这里。请创建一个快速入门将它附加到Github中的问题。 – svenmeier

我的问题不是由检票DND而是由一个显然矛盾的参考JQuery的UI在我的标记引起的（JQuery用户界面不Wicket DND是必需的，但是用于我的应用程序的其他组件）。

任何问题与WiQuery提供的参考更换此不再结果：

@Override 
public void renderHead(final IHeaderResponse response) { 
    super.renderHead(response); 

    // Ensure that Wicket's jQuery library is always loaded, so we can invoke our own jQuery calls 
    response.render(JavaScriptReferenceHeaderItem.forReference(getApplication().getJavaScriptLibrarySettings().getJQueryReference())); 
    response.render(JavaScriptReferenceHeaderItem.forReference(CoreUIJavaScriptResourceReference.get())); 
}

来源

2013-08-07 02:33:12 nullPainter

wicket-dnd使用标准的css选择器来确定放置位置。

以下是在检票DND-例子修改TableExample：

table.add(new DropTarget(Operation.MOVE) 
{ 
    @Override 
    public void onDrop(AjaxRequestTarget target, Transfer transfer, Location location) 
      throws Reject 
     // something was dropped 
    { 
}.dropTopAndBottom("tr");

来源

2013-07-28 14:55:25 svenmeier

谢谢Sven;问题是这不起作用。我为我的问题添加了一些简化的代码。 – nullPainter

Wicket DND - 使用表格放置顶部/底部

回答

相关问题