YouTip

-- Learning is not just about technology, but also about dreams! Home HTML JAVASCRIPT CSS VUE REACT PYTHON3 JAVA C C++ C# AI GO SQL LINUX VS CODE BOOTSTRAP GIT Local Bookmarks jQuery EasyUI Tutorial jQuery EasyUI Tutorial jQuery EasyUI Introduction jEasyUI Applications jEasyUI Creating CRUD Applications jEasyUI Creating CRUD DataGrid jEasyUI Form CRUD Applications jEasyUI Creating an RSS Reader jEasyUI Drag and Drop jEasyUI Basic Drag and Drop jEasyUI Creating a Drag and Drop Shopping Cart jEasyUI Creating a School Timetable jEasyUI Menu and Buttons jEasyUI Creating a Simple Menu jEasyUI Creating Link Buttons jEasyUI Creating Menu Buttons jEasyUI Creating Split Buttons jEasyUI Layout jEasyUI Creating Border Layout jEasyUI Creating Complex Layout jEasyUI Creating Accordion Panels jEasyUI Creating Tabs jEasyUI Dynamically Adding Tabs jEasyUI Adding Auto-play Tabs jEasyUI Creating XP-style Left Panel jEasyUI DataGrid jEasyUI Converting HTML Table to DataGrid jEasyUI Getting Selected Row Data jEasyUI Adding Search Functionality jEasyUI Adding Toolbar jEasyUI Creating Complex Toolbar jEasyUI Setting Frozen Columns jEasyUI Dynamically Changing Columns jEasyUI Formatting Columns jEasyUI Setting Sorting jEasyUI Custom Sorting jEasyUI Creating Column Groups jEasyUI Adding Checkboxes jEasyUI Custom Pagination jEasyUI Enabling Inline Editing jEasyUI Extending Editors jEasyUI Column Calculation jEasyUI Merging Cells jEasyUI Creating Custom View jEasyUI Creating Footer Summary jEasyUI Conditionally Setting Row Background Color jEasyUI Creating PropertyGrid jEasyUI Extending Row Detail Display jEasyUI Creating Sub-Grid jEasyUI Displaying Massive Data jEasyUI Adding Pagination Component jEasyUI Window jEasyUI Creating Simple Window jEasyUI Customizing Window Toolbar jEasyUI Window and Layout jEasyUI Creating Dialog jEasyUI Customizing Dialog jEasyUI Tree Menu jEasyUI Creating Tree Menu with Markup jEasyUI Creating Asynchronous Tree Menu jEasyUI Adding Nodes to Tree Menu jEasyUI Creating Tree Menu with Checkboxes jEasyUI Tree Menu Drag and Drop Control jEasyUI Tree Menu Loading Parent/Child Nodes jEasyUI Creating Basic TreeGrid jEasyUI Creating Complex TreeGrid jEasyUI TreeGrid Dynamic Loading jEasyUI TreeGrid Adding Pagination jEasyUI TreeGrid Lazy Loading Nodes jEasyUI Form jEasyUI Creating Asynchronous Submit Form jEasyUI Form Validation jEasyUI Creating Tree ComboBox jEasyUI Formatting ComboBox jEasyUI Filtering ComboBox DataGrid jEasyUI Reference Manual jQuery EasyUI Plugins jQuery EasyUI Extensions jQuery EasyUI Plugins In-depth Exploration Programming Scripting Languages Programming Languages Software Scripts Web Service Development Tools Web Design and Development Computer Science Web Services jQuery EasyUI Extension - DataGrid Row Drag and Drop (Drag and Drop Rows in DataGrid) jQuery EasyUI Extensions Usage Include the 'datagrid-dnd.js' file Enable Drag and Drop                                                                                                                                                            

Item ID	Product	List Price	Unit Cost	Attribute	Status

Events These events extend from the DataGrid. Below are the events added for the DataGrid. Name Parameters Description onBeforeDrag row Triggered before a row drag starts. Returning false cancels the drag. onStartDrag row Triggered when dragging a row starts. onStopDrag row Triggered after dragging a row stops. onDragEnter targetRow, sourceRow Triggered when a dragged row enters a valid drop target row. Returning false cancels the drop. onDragOver targetRow, sourceRow Triggered when a dragged row is over a valid drop target row. Returning false cancels the drop. onDragLeave targetRow, sourceRow Triggered when a dragged row leaves a valid drop target row. onBeforeDrop targetRow,sourceRow,point Triggered before a row is dropped. Returning false cancels the drop. targetRow: The target row for the drop. sourceRow: The source row being dragged. point: Indicates the drop position. Possible values: 'top' or 'bottom'. onDrop targetRow,sourceRow,point Triggered when a row is dropped. targetRow: The target row for the drop. sourceRow: The source row being dragged. point: Indicates the drop position. Possible values: 'top' or 'bottom'. Methods These methods extend from the DataGrid. Name Parameters Description enableDnd index Enable row drag and drop. The 'index' parameter indicates the row to be enabled for drag and drop. If not specified, all rows are enabled for drag and drop. Code Example: $('#dg').datagrid('enableDnd', 1);    // enable dragging on second row $('#dg').datagrid('enableDnd');    // enable dragging all rows Download jQuery EasyUI Example jquery-easyui-datagrid-dnd.zip jQuery EasyUI Extensions jQuery EasyUI Plugins ByteArk Coding Plan Supports mainstream large models like Doubao, GLM, DeepSeek, Kimi, MiniMax, officially supplied, stable and reliable. Configuration Guide ¥9.9 / month Subscribe Now iFlytek Star Coding Plan Includes free model call quota, DeepSeek, GLM, Kimi, MiniMax, one-stop experience and deployment platform. Configuration Guide ¥3.9 / month Subscribe Now Click to share notes Category Navigation Python / Data Science AI / Intelligent Development Front-end Development Back-end Development Database Mobile Development DevOps / Engineering Programming Languages Computer Basics XML / Web Service .NET Website Construction Advertisement jQuery EasyUI Tutorial jQuery EasyUI Tutorial jQuery EasyUI Introduction jEasyUI Applications jEasyUI Creating CRUD Applications jEasyUI Creating CRUD DataGrid jEasyUI Form CRUD Applications jEasyUI Creating an RSS Reader jEasyUI Drag and Drop jEasyUI Basic Drag and Drop jEasyUI Creating a Drag and Drop Shopping Cart jEasyUI Creating a School Timetable jEasyUI Menu and Buttons jEasyUI Creating a Simple Menu jEasyUI Creating Link Buttons jEasyUI Creating Menu Buttons jEasyUI Creating Split Buttons jEasyUI Layout jEasyUI Creating Border Layout jEasyUI Creating Complex Layout jEasyUI Creating Accordion Panels jEasyUI Creating Tabs jEasyUI Dynamically Adding Tabs jEasyUI Adding Auto-play Tabs jEasyUI Creating XP-style Left Panel jEasyUI DataGrid jEasyUI Converting HTML Table to DataGrid jEasyUI Getting Selected Row Data jEasyUI Adding Search Functionality jEasyUI Adding Toolbar jEasyUI Creating Complex Toolbar jEasyUI Setting Frozen Columns jEasyUI Dynamically Changing Columns jEasyUI Formatting Columns jEasyUI Setting Sorting jEasyUI Custom Sorting jEasyUI Creating Column Groups jEasyUI Adding Checkboxes jEasyUI Custom Pagination jEasyUI Enabling Inline Editing jEasyUI Extending Editors jEasyUI Column Calculation jEasyUI Merging Cells jEasyUI Creating Custom View jEasyUI Creating Footer Summary jEasyUI Conditionally Setting Row Background Color jEasyUI Creating PropertyGrid jEasyUI Extending Row Detail Display jEasyUI Creating Sub-Grid jEasyUI Displaying Massive Data jEasyUI Adding Pagination Component jEasyUI Window jEasyUI Creating Simple Window jEasyUI Customizing Window Toolbar jEasyUI Window and Layout jEasyUI Creating Dialog jEasyUI Customizing Dialog jEasyUI Tree Menu jEasyUI Creating Tree Menu with Markup jEasyUI Creating Asynchronous Tree Menu jEasyUI Adding Nodes to Tree Menu jEasyUI Creating Tree Menu with Checkboxes jEasyUI Tree Menu Drag and Drop Control jEasyUI Tree Menu Loading Parent/Child Nodes jEasyUI Creating Basic TreeGrid jEasyUI Creating Complex TreeGrid jEasyUI TreeGrid Dynamic Loading jEasyUI TreeGrid Adding Pagination jEasyUI TreeGrid Lazy Loading Nodes jEasyUI Form jEasyUI Creating Asynchronous Submit Form jEasyUI Form Validation jEasyUI Creating Tree ComboBox jEasyUI Formatting ComboBox jEasyUI Filtering ComboBox DataGrid jEasyUI Reference Manual jQuery EasyUI Plugins jQuery EasyUI Extensions Online Examples ·HTML Examples ·CSS Examples ·JavaScript Examples ·Ajax Examples ·jQuery Examples ·XML Examples ·Java Examples Character Sets & Tools · HTML Character Set Settings · HTML ASCII Character Set · JS Obfuscation/Encryption · PNG/JPEG Image Compression · HTML Color Picker · JSON Formatting Tool · Random Number Generator Latest Updates · Large Model Multimodal (M... · Codex Advanced Configuration · AI Agent Terminology · ZCode Getting Started Tutorial · Loop Engineerin... · Claude Code Us... · Claude Code Us... Site Information · Feedback · Disclaimer · About Us · Article Archive Follow WeChat My Favorites Mark Article Browsing History Clear All No Records