diff --git a/js/src/modules/functions.js b/js/src/modules/functions.js
index 8fe63ef8ae..0e0f5e0e28 100644
--- a/js/src/modules/functions.js
+++ b/js/src/modules/functions.js
@@ -2,7 +2,6 @@ import $ from 'jquery';
 import { AJAX } from './ajax.js';
 import { Navigation } from './navigation.js';
 import { CommonParams } from './common.js';
-import { Indexes } from './indexes.js';
 import { Config } from './config.js';
 import tooltip from './tooltip.js';
 import highlightSql from './sql-highlight.js';
@@ -12,6 +11,7 @@ import { escapeHtml } from './functions/escape.js';
 import getImageTag from './functions/getImageTag.js';
 import handleRedirectAndReload from './functions/handleRedirectAndReload.js';
 import refreshMainContent from './functions/refreshMainContent.js';
+import checkIndexType from './indexes/checkIndexType.js';
 
 /* global DatabaseStructure */ // js/database/structure.js
 /* global firstDayOfCalendar, themeImagePath */ // templates/javascript/variables.twig
@@ -2759,7 +2759,7 @@ Functions.indexRenameDialog = function (url, title, callbackSuccess, callbackFai
 };
 
 Functions.showIndexEditDialog = function ($outer) {
-    Indexes.checkIndexType();
+    checkIndexType();
     Functions.checkIndexName('index_frm');
     var $indexColumns = $('#index_columns');
     $indexColumns.find('td').each(function () {
diff --git a/js/src/modules/indexes.js b/js/src/modules/indexes.js
index 1a5ddc0a1d..05d47fd2d5 100644
--- a/js/src/modules/indexes.js
+++ b/js/src/modules/indexes.js
@@ -7,6 +7,7 @@ import highlightSql from './sql-highlight.js';
 import { ajaxRemoveMessage, ajaxShowMessage } from './ajax-message.js';
 import getJsConfirmCommonParam from './functions/getJsConfirmCommonParam.js';
 import refreshMainContent from './functions/refreshMainContent.js';
+import checkIndexType from './indexes/checkIndexType.js';
 
 /**
  * @fileoverview    function used for index manipulation pages
@@ -89,88 +90,6 @@ Indexes.getIndexArray = function (indexChoice) {
     return sourceArray;
 };
 
-/**
- * Hides/shows the inputs and submits appropriately depending
- * on whether the index type chosen is 'SPATIAL' or not.
- */
-Indexes.checkIndexType = function () {
-    /**
-     * @var {JQuery<HTMLElement}, Dropdown to select the index choice.
-     */
-    var $selectIndexChoice = $('#select_index_choice');
-    /**
-     * @var {JQuery<HTMLElement}, Dropdown to select the index type.
-     */
-    var $selectIndexType = $('#select_index_type');
-    /**
-     * @var {JQuery<HTMLElement}, Table header for the size column.
-     */
-    var $sizeHeader = $('#index_columns').find('thead tr').children('th').eq(1);
-    /**
-     * @var {JQuery<HTMLElement}, Inputs to specify the columns for the index.
-     */
-    var $columnInputs = $('select[name="index[columns][names][]"]');
-    /**
-     * @var {JQuery<HTMLElement}, Inputs to specify sizes for columns of the index.
-     */
-    var $sizeInputs = $('input[name="index[columns][sub_parts][]"]');
-    /**
-     * @var {JQuery<HTMLElement}, Footer containing the controllers to add more columns
-     */
-    var $addMore = $('#index_frm').find('.add_more');
-
-    if ($selectIndexChoice.val() === 'SPATIAL') {
-        // Disable and hide the size column
-        $sizeHeader.hide();
-        $sizeInputs.each(function () {
-            $(this)
-                .prop('disabled', true)
-                .parent('td').hide();
-        });
-
-        // Disable and hide the columns of the index other than the first one
-        var initial = true;
-        $columnInputs.each(function () {
-            var $columnInput = $(this);
-            if (! initial) {
-                $columnInput
-                    .prop('disabled', true)
-                    .parent('td').hide();
-            } else {
-                initial = false;
-            }
-        });
-
-        // Hide controllers to add more columns
-        $addMore.hide();
-    } else {
-        // Enable and show the size column
-        $sizeHeader.show();
-        $sizeInputs.each(function () {
-            $(this)
-                .prop('disabled', false)
-                .parent('td').show();
-        });
-
-        // Enable and show the columns of the index
-        $columnInputs.each(function () {
-            $(this)
-                .prop('disabled', false)
-                .parent('td').show();
-        });
-
-        // Show controllers to add more columns
-        $addMore.show();
-    }
-
-    if ($selectIndexChoice.val() === 'SPATIAL' ||
-        $selectIndexChoice.val() === 'FULLTEXT') {
-        $selectIndexType.val('').prop('disabled', true);
-    } else {
-        $selectIndexType.prop('disabled', false);
-    }
-};
-
 /**
  * Sets current index information into form parameters.
  *
@@ -643,7 +562,7 @@ Indexes.on = () => function () {
 
     $(document).on('change', '#select_index_choice', function (event) {
         event.preventDefault();
-        Indexes.checkIndexType();
+        checkIndexType();
         Functions.checkIndexName('index_frm');
     });
 
diff --git a/js/src/modules/indexes/checkIndexType.js b/js/src/modules/indexes/checkIndexType.js
new file mode 100644
index 0000000000..5780f1d197
--- /dev/null
+++ b/js/src/modules/indexes/checkIndexType.js
@@ -0,0 +1,83 @@
+import $ from 'jquery';
+
+/**
+ * Hides/shows the inputs and submits appropriately depending
+ * on whether the index type chosen is 'SPATIAL' or not.
+ */
+export default function checkIndexType () {
+    /**
+     * @var {JQuery<HTMLElement}, Dropdown to select the index choice.
+     */
+    var $selectIndexChoice = $('#select_index_choice');
+    /**
+     * @var {JQuery<HTMLElement}, Dropdown to select the index type.
+     */
+    var $selectIndexType = $('#select_index_type');
+    /**
+     * @var {JQuery<HTMLElement}, Table header for the size column.
+     */
+    var $sizeHeader = $('#index_columns').find('thead tr').children('th').eq(1);
+    /**
+     * @var {JQuery<HTMLElement}, Inputs to specify the columns for the index.
+     */
+    var $columnInputs = $('select[name="index[columns][names][]"]');
+    /**
+     * @var {JQuery<HTMLElement}, Inputs to specify sizes for columns of the index.
+     */
+    var $sizeInputs = $('input[name="index[columns][sub_parts][]"]');
+    /**
+     * @var {JQuery<HTMLElement}, Footer containing the controllers to add more columns
+     */
+    var $addMore = $('#index_frm').find('.add_more');
+
+    if ($selectIndexChoice.val() === 'SPATIAL') {
+        // Disable and hide the size column
+        $sizeHeader.hide();
+        $sizeInputs.each(function () {
+            $(this)
+                .prop('disabled', true)
+                .parent('td').hide();
+        });
+
+        // Disable and hide the columns of the index other than the first one
+        var initial = true;
+        $columnInputs.each(function () {
+            var $columnInput = $(this);
+            if (! initial) {
+                $columnInput
+                    .prop('disabled', true)
+                    .parent('td').hide();
+            } else {
+                initial = false;
+            }
+        });
+
+        // Hide controllers to add more columns
+        $addMore.hide();
+    } else {
+        // Enable and show the size column
+        $sizeHeader.show();
+        $sizeInputs.each(function () {
+            $(this)
+                .prop('disabled', false)
+                .parent('td').show();
+        });
+
+        // Enable and show the columns of the index
+        $columnInputs.each(function () {
+            $(this)
+                .prop('disabled', false)
+                .parent('td').show();
+        });
+
+        // Show controllers to add more columns
+        $addMore.show();
+    }
+
+    if ($selectIndexChoice.val() === 'SPATIAL' ||
+        $selectIndexChoice.val() === 'FULLTEXT') {
+        $selectIndexType.val('').prop('disabled', true);
+    } else {
+        $selectIndexType.prop('disabled', false);
+    }
+}