Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
Showing results for 
Search instead for 
Did you mean: 
Copy & Paste (Drag – Drop) Functionality

In SAPUI5 we have 2 controls for table (i) sap.ui.table.Table (ii) sap.m.Table

In UI5 tables let us say if we have multi select combo box or text field in the aggregation row bindings it is tedious job for us to modify each row if we want to copy single value and copy to multiple rows. In order to achieve this functionality I have used drag and drop feature of jQuery and attached the event in the row elements.

As shown in the below example Brand value is having Multi Select Combo Box. If we have to copy and paste same value to other rows it is time consuming task and not a good user experience.


So to improve user experience we can achieve copy & paste functionality using drag and drop feature of jQuery



Sample Code is available in github


Code Explained:


STEP1: Reading each row by id

$("[id^=dfReqColDropdown]").each(function() {


STEP2: Drag event is attached

$("#" + objEleID).prop("draggable", "true");

$("#" + objEleID).on('dragstart', function (event)

STEP3: Drop event is attached

$("#" + objEleID).prop("ondrop", "drop(event)");

$("#" + objEleID).on("dragover", function (event)

STEP4: On drop event value is fetched from drag and replicating the value

var dragVal = $("#" + originCtrlID).val();

$("#" + this.getAttribute("id")).val(dragVal);


Labels in this area