making Company column searchable

docs/batchCodeTable.js

@@ -48,7 +48,6 @@ class BatchCodeTableInitializer {
                                 this.#getColumnIndex('Deaths'),
                                 this.#getColumnIndex('Disabilities'),
                                 this.#getColumnIndex('Life Threatening Illnesses'),
-                                this.#getColumnIndex('Company'),
                                 this.#getColumnIndex('Countries'),
                                 this.#getColumnIndex('Severe reports'),
                                 this.#getColumnIndex('Lethality')
@@ -56,7 +55,7 @@ class BatchCodeTableInitializer {
                         },
                         {
                             orderable: false,
-                            targets: this.#getColumnIndex('Countries')
+                            targets: [this.#getColumnIndex('Countries'), this.#getColumnIndex('Company')]
                         },
                         {
                             render: (data, type, row) => {
@@ -105,6 +104,7 @@ class BatchCodeTableInitializer {
             })
             .then(json => {
                 this.#setTableRows(json.data);
+                this.#makeCompanyColumnSearchable();
                 this.#selectInput();
                 this.#displayControlColumn(country == 'Global');
             });
@@ -122,6 +122,27 @@ class BatchCodeTableInitializer {
             .draw();
     }
 
+    #makeCompanyColumnSearchable() {
+        // adapted from https://datatables.net/examples/api/multi_filter_select.html
+        const companyColumn = this.#batchCodeTable.column(this.#getColumnIndex('Company'));
+        const select = $('<select><option value=""></option></select>')
+            .appendTo($(companyColumn.header()))
+            .on('change', function () {
+                const val = $.fn.dataTable.util.escapeRegex($(this).val());
+                companyColumn
+                    .search(val ? '^' + val + '$' : '', true, false)
+                    .draw();
+            });
+
+        companyColumn
+            .data()
+            .unique()
+            .sort()
+            .each(function (d, _) {
+                select.append('<option value="' + d + '">' + d + '</option>');
+            });
+    }
+
     #selectInput() {
         const input = document.querySelector(".dataTables_filter input");
         input.focus();