Form action and method in ejs

Question

Very new to node.js and using ejs. After converting html files to ejs for using partials my 'search button' is no longer longer running the js which is linked to it's id. After researching I presume it has something to not having:

<form action="" method="">

However I am unsure how these work. Below is the ejs code:

<form class="form-inline my-2 my-lg-0">
  <input id="sbar"class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
  <button id="drinkSearch"class="btn btn-outline-success my-2 my-sm-0" type="button">Search</button>
</form>

And the start of js using this (file name: main.js):

   $('#drinkSearch').click(function(){
console.log("this works");
//Gather searchterms
var word = document.getElementById("sbar").value;
//Show results div, hide default main page
$( "#mainPage").toggle(false);
$( "#resultsbox").toggle(true);

//Stop button from refreshing page (default function)
event.preventDefault();
console.log(word)

//Get API response using searchterms
  $.getJSON("https://www.thecocktaildb.com/api/json/v1/1/search.php?s="+ word, function(Result) {
    console.log(Result)




    Result.drinks.forEach((drink) => {
      var drinkName = drink.strDrink;
      console.log(drinkName);
const drinkEntries = Object.entries(drink),
  //Build arrays out of the two sets of keys
  [
    ingredientsArray,
    measuresArray
  ] = [
    "strIngredient",
    "strMeasure"
  ].map((keyName) => Object.assign([], ...drinkEntries
      .filter(([key, value]) => key.startsWith(keyName))
      .map(([key, value]) => ({[parseInt(key.slice(keyName.length))]: value})))),

  // Filters empty values based on the ingredients
  {
    finalIngredients,
    finalMeasures
  } = ingredientsArray.reduce((results, value, index) => {
    if(value && value.trim() || measuresArray[index] && measuresArray[index].trim()){
      results.finalIngredients.push(value);
      results.finalMeasures.push(measuresArray[index]);
    }

    return results;
  }, {
    finalIngredients: [],
    finalMeasures: []
  }),

  // zip both arrays
  ingredientsWithMeasures = finalIngredients
    .map((value, index) => [finalMeasures[index], value]);

// Output
console.log("Ingredients:", finalIngredients);
console.log("Measures:", finalMeasures);

$('#resultsTable > tbody:last').append( "<tr><td>"+ drinkName + "</td> + <td>"+ ingredientsWithMeasures + "</td></tr>" );


console.log("All ingredients and measures:\n", ingredientsWithMeasures
  .map(([measure, ingredient]) => `${(measure || "").trim()} ${(ingredient || "").trim()}`)
  .join("\n"));
});

   });

});

Any help for solutions to get the js method running and understanding the use of forms within node and ejs would be very helpful.