how to set row can only drop in it's own grid?

[James]

I set grid with id 'grid' and set dropAccept:'#grid tr.datagrid-row', but it's not working, because grid table are not really in #grid element;
have to set a parent panel with id 'box' and set dropAccept:'#box tr.datagrid-row' to make it work.
is there any convenient way?

[jarry]

Try this code:

Code:

<table class="easyui-datagrid" title="DataGrid" style="width:400px;height:250px" data-options="
      singleSelect:true,
      cls:'mydatagrid',
      dropAccept:'.mydatagrid tr.datagrid-row',
      data:data,
      onLoadSuccess:function(){
        $(this).datagrid('enableDnd');
      }
    ">
  <thead>
    <tr>
      <th data-options="field:'itemid',width:80">Item ID</th>
      <th data-options="field:'productid',width:100">Product</th>
      <th data-options="field:'listprice',width:80,align:'right'">List Price</th>
      <th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
      <th data-options="field:'attr1',width:250">Attribute</th>
      <th data-options="field:'status',width:60,align:'center'">Status</th>
    </tr>
  </thead>
</table>