Dragsort html drag-and-drop sorting, and dragsort drag-and-drop sorting
I. Jquery List DragSort
For some pages, such as homepage customization, dynamic drag-and-drop sorting is required. We generally use some js plug-ins to implement these functions because it is difficult to implement them by ourselves. Dragsort helps us fulfill this requirement. With dragsort, we can easily drag and drop elements on html pages and sort them dynamically. Dragsort is a jquery plug-in, which is very convenient to use. Dragsort Website: dragsort: http://dragsort.codeplex.com /.
Download dragsort and decompress it, as shown in,
We use only the jquery. dragsort-0.5.2.js file inside, you can also use the compressed version of min. js.
Ii. Instances
1. Use
Copy jquery. dragsort-0.5.2.js to the same folder as the jquery-2.1.3.min.js to create a new html page. Introduce these two js files. Note that jquery is introduced in dragsort. The related code is as follows:
1 <! DOCTYPE html> 2
The two input values are li IDS (connected by ","), and the id values identify the order of the current group li. When dragging across groups, the values in the two inputs change accordingly. To achieve the effect of moving across groups. When you need to save it, you can directly use ajax to submit the two input values, and parse the data in the background and save it to the database.
2. The effect is as follows.
Download example: download.