【HTML】<form action="" method="GET">でselect要素で選択した値が飛ばない。

Question

以下のようなソースで、セレクト要素で選択した値をURLパラメータに渡し、
そのまま今のページに戻ってくるというような実装を試みておりますが、
値を選択しても何も起こりません。
原因について、何か分かる事があれば教えていただけますでしょうか。
submitボタンは用意しておらず、selectのoptionを選択するのをトリガーとしたいです。
よろしくお願いいたします。

<div class="l-container u-containerBreak">
  <h1 class="c-middleTitle">テスト情報一覧</h1>
  <form action="" method="GET" id="news">
  <input type="hidden" name="cat" value="" />
  <div class="c-newsSelect">
    <div class="c-newsSelect__item">
      <select name="product" id="item_id">
        <option value="" class="firstChild">テスト製品名</option>													                
        <option value="1" >テストA</option>																		 
        <option value="22" >テストB</option>																		 
        <option value="3" >テストC</option>																	
      </select>
    </div>
  </div>
  <div class="c-newsSelect__item">
    <select name="year" id="year" class="">
      <option value="" class="firstChild">公開年</option>																			 
      <option value="2021" >2021年</option>																			 
      <option value="2020" >2020年</option>																			
    </select>
  </div>
  </form>
</div>

Answer 1

SUBMITボタンがないのなら、相応の機能を用意しなければ何もしません。
form送信も「イベント」なので、明確に書かない限りHTMLは何もしません。
SUBMITボタンがあるときはそのボタンの機能で送信してくれていただけです。

EventTarget.addEventListener()
HTMLFormElement: submit イベント

Answer 2

submitボタンは用意しておらず、selectのoptionを選択するのをトリガーとしたいです。

<select> の change イベントのハンドラで、所属する <form> を submit() すれば良いです。