Merge branch 'develop' into feature

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

@@ -1,4 +1,32 @@
-import { getElements, scrollTo } from '../util';
+import { getElements, scrollTo, isTruthy } from '../util';
+
+/**
+ * When editing an object, it is sometimes desirable to customize the form action *without*
+ * overriding the form's `submit` event. For example, the 'Save & Continue' button. We don't want
+ * to use the `formaction` attribute on that element because it will be included on the form even
+ * if the button isn't clicked.
+ *
+ * @example
+ * ```html
+ * <button type="button" return-url="/special-url/">
+ *   Save & Continue
+ * </button>
+ * ```
+ *
+ * @param event Click event.
+ */
+function handleSubmitWithReturnUrl(event: MouseEvent): void {
+  const element = event.target as HTMLElement;
+  if (element.tagName === 'BUTTON') {
+    const button = element as HTMLButtonElement;
+    const action = button.getAttribute('return-url');
+    const form = button.form;
+    if (form !== null && isTruthy(action)) {
+      form.action = action;
+      form.submit();
+    }
+  }
+}
 
 function handleFormSubmit(event: Event, form: HTMLFormElement): void {
   // Track the names of each invalid field.
@@ -38,6 +66,15 @@ function handleFormSubmit(event: Event, form: HTMLFormElement): void {
   }
 }
 
+/**
+ * Attach event listeners to form buttons with the `return-url` attribute present.
+ */
+function initReturnUrlSubmitButtons(): void {
+  for (const button of getElements<HTMLButtonElement>('button[return-url]')) {
+    button.addEventListener('click', handleSubmitWithReturnUrl);
+  }
+}
+
 /**
  * Attach an event listener to each form's submitter (button[type=submit]). When called, the
  * callback checks the validity of each form field and adds the appropriate Bootstrap CSS class
@@ -54,4 +91,5 @@ export function initFormElements(): void {
       submitter.addEventListener('click', (event: Event) => handleFormSubmit(event, form));
     }
   }
+  initReturnUrlSubmitButtons();
 }

netbox/project-static/src/search.ts

@@ -107,6 +107,9 @@ function initTableFilter(): void {
       // Create a regex pattern from the input search text to match against.
       const filter = new RegExp(target.value.toLowerCase().trim());
 
+      // List of which rows which match the query
+      const matchedRows: Array<HTMLTableRowElement> = [];
+
       for (const row of rows) {
         // Find the row's checkbox and deselect it, so that it is not accidentally included in form
         // submissions.
@@ -114,19 +117,26 @@ function initTableFilter(): void {
         if (checkBox !== null) {
           checkBox.checked = false;
         }
+
         // Iterate through each row's cell values
         for (const value of getRowValues(row)) {
           if (filter.test(value.toLowerCase())) {
-            // If this row matches the search pattern, but is already hidden, unhide it and stop
-            // iterating through the rest of the cells.
-            row.classList.remove('d-none');
+            // If this row matches the search pattern, add it to the list.
+            matchedRows.push(row);
             break;
-          } else {
-            // If none of the cells in this row match the search pattern, hide the row.
-            row.classList.add('d-none');
           }
         }
       }
+
+      // Iterate the rows again to set visibility.
+      // This results in a single reflow instead of one for each row.
+      for (const row of rows) {
+        if (matchedRows.indexOf(row) >= 0) {
+          row.classList.remove('d-none');
+        } else {
+          row.classList.add('d-none');
+        }
+      }
     }
     input.addEventListener('keyup', debounce(handleInput, 300));
   }