Is it possible to decide the droppable area on the fly based on target element offset() in drop container?
In general elements gets stacked after drag & drop.
Demo Plunk - http://plnkr.co/edit/n4uDXfKOMUGz3ffRNCnL?p=preview
Refer Drop.js file in the plunk to view the code written for drop functionality.
$(context.destination).droppable({
accept: ".form-element-link",
drop: function(event, ui) {
context.onDrop(event, ui);
},
over: function(event, ui) {
},
out: function(event, ui) {
}
});
Elements get stacked when dropped in container and to highlight the drop area, a horizontal bar with dotted blue color is shown to show the element stacked position.
Expected End result :
Actual ask is to highlight the placeholder with blue bar on right side of existing field set. This way 2-column layout will be achieved where fields will be placed adjacent to each other. Like this -
Is it possible to achieve the desired results with JQuery droppable() API? If yes, then please suggest the logical route to make it happen.
Any help will be appreciated.