перезагрузить страницу я теряю все значения в форме

Там можно сохранить данные без ajax и без отправки чего-либо на сервер. Он назывался sessionStorage.

// store item
localStorage.setItem("index", "value");

// retrieve item
var data = localStorage.getItem("index");

Поэтому вам просто нужно сохранить данные с помощью sessionStorage после любого действия (нажмите кнопку, keydown, mouseleave...) и перезагрузите страницу, вам просто нужно будет заполнить ее снова из данных, которые вы сохранили в сеансе!

Проверьте cache-control страницы. Этот атрибут говорит браузеру опираться на собственный кеш, чтобы перезагрузить страницы.

Это можно установить как метатег. Например:

<meta http-equiv="Cache-control" content="public">

Но лучший подход (по моему мнению) осуществляется через серверную сторону, используя функцию header().

Обратите внимание, что некоторые предпочитают устанавливать его no-cache когда дело доходит до форм, чтобы избежать спама, а также по соображениям безопасности.

Я предполагаю, что перезагружая форму, которую вы хотите передать, она возвращает версию страницы со вторым выпадающим списком, расположенным в соответствии с представленным первым выпадающим списком. Если это так, вы можете подумать о том, чтобы все возможные значения второго раскрывающегося списка были скрыты, а затем заполняли его JavaScript после выбора в первом. Если количество возможных значений очень велико или должно быть вычислено на стороне сервера (как, вы не можете знать все значения изначально), вы можете использовать AJAX для отправки формы и не перезагружать всю страницу.