Creating a UI with drag-and-drop
Drag-and-drop is another new feature of HTML5. It was already possible to create drag-and-drop objects in web pages, but you needed to include a JavaScript library like jQuery or Prototype. As of HTML5, drag-and-drop is native supported by the use of a drag-and-drop API.
Drag-and-drop can offer a user-friendly user interface, where the user can easily move objects. We will create a web page where the user can drag-and-drop employees to other departments. On dropping the employee, the table EMP
is updated with the new DEPTNO
.
Getting ready
Make sure, you have access to the EMP
and DEPT
tables. We will use these tables to demonstrate how easy it is to move an employee from one department to another department, using the drag-and-drop functionality.
How to do it...
First, we will create the page:
In Application Builder, click on Create Page.
Click on Blank Page.
Enter the desired page number or leave the default value. Click on Next.
Enter a name for the page, for example...