Hello All,
We are working on SAP ui5 application where Drag and Drop between a table (Droppable Table sap.m) and List (Draggable Table as shown in figure) is required.
We followed this example:
http://scn.sap.com/community/developer-center/front-end/blog/2015/08/21/how-to-use-drag-and-drop-between-two-sapui5-ui-elements
In this example new item is added to droppable table when dropped, our requirement is to replace the item with dragged item.
We have implemented JQUERY plug-in and able to drag an items from List to table, but could not identify the Dropped Index.
JQUERY required:
$.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-droppable');
$.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-draggable');
Here is the code:
Problem: In Drop: method, how to get the Droppable Table Index where an item is dropped.
$("#" + tableId).droppable({
drop: function(event, ui) {
var listElementId = ui.draggable.context.id;
var draggedElement = sap.ui.getCore().byId(listElementId);
var oPath = draggedElement.getBindingContext("materials").getPath();
var split = oPath.split("/");
var draggedIndex = split[1];
targetData[draggedIndex].id = materialData[draggedIndex].id;
targetData[draggedIndex].description = materialData[draggedIndex].description;
targetModel.setData(targetData);
}});
PARAM “ui” gives the Index of Dragged Index and to get the Droppable table Index I tried the following:
var rowindex = $( this ).closest( 'tr' ).index();
var rowindex = $(this).parents("tr").index();
var rowindex = $(this).parent().parent().children().index($(this).parent);
These statements returns -1 all the time.
Please suggest solutions.
Regards,
Nagaraju A