Creating a School Timetable
Tutorial » Creating a School Timetable
This tutorial will show you how to create a school timetable using jQuery EasyUI. We will build two tables: school subjects on the left and timetable on the right. You could drag school subject and drop it on a timetable cell. The school subject is a <div class="item"> element while timetable cell is a <td class="drop"> element.
Displaying school subjects
Drag the school subject on the left
Drop the school subject on timetable cell
As you can see the code above, when users drag the school subject on the left and drop it to the timetable cell, the onDrop callback function will be called. We clone the source element dragged from left and append it on timetable cell. When dragging school subject from timetable cell to another cell, simply move it.