Fix auto-selection of selected columns

netbox/extras/forms/model_forms.py

@@ -320,9 +320,8 @@ class TableConfigForm(forms.ModelForm):
     )
     columns = SimpleArrayField(
         base_field=forms.CharField(),
-        required=False,
         widget=forms.SelectMultiple(
-            attrs={'size': 10, 'class': 'form-select'}
+            attrs={'size': 10, 'class': 'form-select select-all'}
         ),
         label=_('Selected Columns')
     )

netbox/project-static/src/forms/elements.ts

@@ -1,6 +1,12 @@
 import { getElements, scrollTo } from '../util';
 
 function handleFormSubmit(event: Event, form: HTMLFormElement): void {
+  // Automatically select all options in any <select> with the "select-all" class. This is useful for
+  // multi-select fields that are used to add/remove choices.
+  for (const element of getElements<HTMLOptionElement>('select.select-all option')) {
+    element.selected = true;
+  }
+
   // Track the names of each invalid field.
   const invalids = new Set<string>();
 

netbox/project-static/src/tableConfig.ts

@@ -1,16 +1,6 @@
 import { createToast } from './bs';
 import { getElements, apiPatch, hasError, getSelectedOptions } from './util';
 
-/**
- * Mark each option element in the selected columns element as 'selected' so they are submitted to
- * the API.
- */
-function saveTableConfig(): void {
-  for (const element of getElements<HTMLOptionElement>('select[name="columns"] option')) {
-    element.selected = true;
-  }
-}
-
 /**
  * Add columns to the table config select element.
  */
@@ -124,9 +114,6 @@ function handleSubmit(event: Event): void {
  * Initialize table configuration elements.
  */
 export function initTableConfig(): void {
-  for (const element of getElements<HTMLButtonElement>('#save_tableconfig')) {
-    element.addEventListener('click', saveTableConfig);
-  }
   for (const element of getElements<HTMLButtonElement>('#add_columns')) {
     element.addEventListener('click', addColumns);
   }

netbox/utilities/forms/forms.py

@@ -121,7 +121,7 @@ class TableConfigForm(forms.Form):
         choices=[],
         required=False,
         widget=forms.SelectMultiple(
-            attrs={'size': 10, 'class': 'form-select'}
+            attrs={'size': 10, 'class': 'form-select select-all'}
         ),
         label=_('Selected Columns')
     )