From 87b8c6af4bed91bb646971b96d81185f346e7d2c Mon Sep 17 00:00:00 2001
From: "Ghislain B." <gbeaulac@gmail.com>
Date: Sun, 28 Jul 2024 00:30:40 -0400
Subject: [PATCH] chore: fix simple reordering example with Row Move, fixes
 issue #1037 (#1042)

fixes#1037 for  `example9-row-reordering-simple.html`, the drag column that was previously shown was actually a regular column, but the issue was that we need to use `moveRowsPlugin.getColumnDefinition()` to get the proper Row Move plugin column that we then need to add to the current column definitions (in other words, we cannot simply create a column and expect it to be draggable, we really need to get the said column by asking the plugin to dynamically return that correct drag column for us
---
 examples/example9-row-reordering-simple.html | 24 ++++++++------------
 1 file changed, 9 insertions(+), 15 deletions(-)

diff --git a/examples/example9-row-reordering-simple.html b/examples/example9-row-reordering-simple.html
index 4ddac60b..d78a5e0f 100644
--- a/examples/example9-row-reordering-simple.html
+++ b/examples/example9-row-reordering-simple.html
@@ -6,6 +6,7 @@
   <title>SlickGrid example 9: Row reordering</title>
   <link rel="stylesheet" href="../dist/styles/css/slick-icons.css" type="text/css"/>
   <link rel="stylesheet" href="../dist/styles/css/example-demo.css" type="text/css"/>
+  <link rel="stylesheet" href="../dist/styles/css/slick-icons.css" type="text/css"/>
   <link rel="stylesheet" href="../dist/styles/css/slick-alpine-theme.css" type="text/css"/>
   <style>
     .slickgrid-cell-reorder {
@@ -59,16 +60,6 @@ <h2>View Source:</h2>
 var grid;
 var data = [];
 var columns = [
-  {
-    id: "#",
-    name: "",
-    width: 40,
-    behavior: "selectAndMove",
-    selectable: false,
-    resizable: false,
-    cssClass: "slickgrid-cell-reorder",
-    formatter: () => `<span class="sgi sgi-drag"></span>`
-  },
   {
     id: "name",
     name: "Name",
@@ -104,7 +95,14 @@ <h2>View Source:</h2>
     { name: "Find out who's naughty", complete: false},
     { name: "Find out who's nice", complete: false}
   ];
-  console.log(data);
+
+  var moveRowsPlugin = new Slick.RowMoveManager({
+    cssClass: 'sgi sgi-drag',
+    cancelEditOnDrag: true
+  });
+
+  // use unshift to make it the 1st column OR splice to position it where you wish
+  columns.unshift(moveRowsPlugin.getColumnDefinition());
 
   grid = new Slick.Grid("#myGrid", data, columns, options);
 
@@ -112,10 +110,6 @@ <h2>View Source:</h2>
     dragToSelect: true
   }));
 
-  var moveRowsPlugin = new Slick.RowMoveManager({
-    cancelEditOnDrag: true
-  });
-
   moveRowsPlugin.onBeforeMoveRows.subscribe(function (e, data) {
     for (var i = 0; i < data.rows.length; i++) {
       // no point in moving before or after itself