Automatically submit a value on click to a form using Javascript/Java in a Django form

I am working on a web app using Django/Python/Javascript/Java. The focal point is a map of the USA. A user should be able to click on a region and the value of that region should automatically query a database and return certain information. Currently, my code produces a const called regionName and the value of regionName is passed automatically as input to the search bar; however, from here a user needs to manually click the ‘search’ button to submit the form and query the database. As below:

  onRegionClick: function(event, code){
            console.log('event', event, 'code', code);
            const regionName = map.getRegionName(code);
            console.log('regionName', regionName);
            $("#selection").val(regionName);
  
        },

      });

What I am trying to do with the code is to automatically submit the value of regionName after it is passed to the search bar. Efforts thus far have been similar to the code below.

$(“#selection”) – the form

$(“#q”) – the name of the button

 $("#selection").on('change', function(){
                if ($("#selection").val() === regionName ) {
                  $("#q").click();
                }
              }); 

This is not producing any errors, but it’s not producing any results either.

I’ve tried various substitutes along similar lines such as:

.on(‘input’.. instead of ‘change’
.submit() instead of .click()

I’ve also have an .autocomplete() method I’m using. I’m not sure if this is causing a conflict.

<script type="text/javascript">
            $(function () {
              var states = [
                {% for states in states %}

                " {{states.state}} ",

                {% endfor %}

              ];

              $("#selection").autocomplete({
                  source: states
              }); 

            });

          </script>