How to add additional query string to form input from html page?

Question

I am trying to recreate the google search form for images, and can't get the image query string to be included in the search. Currently what I have will only return the normal Google search results and omits the &tbm=isch query. However, when I go to https://www.google.com/search?q=cat&tbm=isch the image results are returned

How can I add the &tbm=isch query string from the HTML form?

<form action="https://www.google.com/search?tbm=isch&q=">
<input style="border-radius: 10px;" type="text" name="q">
<input type="submit" value="Google Image Search">
</form>

Answer 1

You have q twice

EITHER add the field as hidden

<form action="https://www.google.com/search">
  <input style="border-radius: 10px;" type="text" name="q">
  <input type="hidden" name="tbm" value="isch" />
  <input type="submit" value="Google Image Search">
</form>

OR use JS to load the URL

document.getElementById("imgSearch").addEventListener("submit", function(e) {
  e.preventDefault();
  const q = this.q.value.trim();
  if (q) location = `https://www.google.com/search?tbm=isch&q=${q}`
})

<form id="imgSearch">
  <input style="border-radius: 10px;" type="text" name="q">
  <input type="submit" value="Google Image Search">
</form>