use addEventListener submit

netbox/project-static/src/netbox.ts

@@ -13,8 +13,6 @@ import { initSideNav } from './sidenav';
 import { initRackElevation } from './racks';
 import { initLinks } from './links';
 import { initHtmx } from './htmx';
-
-// @ts-ignore
 import { cleanGetUrl } from './util';
 
 function initDocument(): void {
@@ -40,6 +38,14 @@ function initDocument(): void {
 }
 
 function initWindow(): void {
+
+  const documentForms = document.forms
+  for (var documentForm of documentForms) {
+    if (documentForm.method.toUpperCase() == 'GET') {
+      documentForm.addEventListener('submit', cleanGetUrl)
+    }
+  }
+
   const contentContainer = document.querySelector<HTMLElement>('.content-container');
   if (contentContainer !== null) {
     // Focus the content container for accessible navigation.

netbox/project-static/src/util.ts

@@ -482,26 +482,36 @@ export function replaceAll(input: string, pattern: string | RegExp, replacement:
 /**
  * Disable empty FormElemnts before submitting the form.
  *
- * @param targetform HTMLFormElement where the FormElements need to be disabled.
+ * @param this HTMLFormElement where the FormElements need to be disabled.
  */
 
-export function cleanGetUrl(targetform: HTMLFormElement) {
+export function cleanGetUrl(this: HTMLFormElement): boolean {
   
-  var form_elements = targetform.elements;
+  var form_elements = this.elements;
 
-  for (const element of form_elements) {
+  for (var element of form_elements) {
     // The SELECT statement requires a different approach. It depends on the selectedIndex, rather that the value.
     switch (element.nodeName) {
       case "SELECT":
         const selectElement = element as HTMLSelectElement;
-        if (selectElement.selectedIndex == null || selectElement.selectedIndex == -1 || selectElement[selectElement.selectedIndex].getAttribute('value') == '') {
+        if (
+          selectElement.selectedIndex == null ||
+          selectElement.selectedIndex == -1 ||
+          selectElement[selectElement.selectedIndex].getAttribute('value') == ''
+        ) {
           element.setAttribute('disabled','');
         }
         break;
       default:
-        if (element.getAttribute('value') == null) {
+        const inputElement = element as HTMLInputElement;
-          element.setAttribute('disabled','');
+        if (
+          !inputElement.value ||
+          inputElement.value == null ||
+          inputElement.value == ''
+        ) {
+          inputElement.setAttribute('disabled','');
         }
     }
   }
+  return true;
 }

netbox/templates/inc/filter_list.html

@@ -1,7 +1,7 @@
 {% load form_helpers %}
 {% load helpers %}
 
-<form action="." method="get" onsubmit="return cleanGetUrl(this)">
+<form action="." method="get">
   <div class="card">
     <div class="card-body overflow-visible d-flex flex-wrap justify-content-between py-3">
       {% for field in filter_form.hidden_fields %}

netbox/templates/search.html

@@ -66,7 +66,7 @@
     {% else %}
         <div class="row">
             <div class="col col-12 col-lg-6 offset-lg-3">
-                <form action="{% url 'search' %}" method="get" class="form form-horizontal" onsubmit="return cleanGetUrl(this)">
+                <form action="{% url 'search' %}" method="get" class="form form-horizontal">
                     <div class="card">
                         <h5 class="card-header">
                             Search

netbox/utilities/templates/search/searchbar.html

@@ -1,4 +1,4 @@
-<form class="input-group" action="{% url 'search' %}" method="get" onsubmit="return util.cleanGetUrl(this)">
+<form class="input-group" action="{% url 'search' %}" method="get">
   <input
     name="q"
     type="text"