Как имитировать submit с отправкой в адресную строку?

Подскажите как имитировать submit с отправкой в адресную строку(http://example.com?var=1&vars=2,3) без перезагрузки страницы. Без разницы post,get(js,jQuery,ajax) главное чтобы отправлял значения. Все работает но значения не отправляет в $_SERVER['REQUEST_URI'] так и выглядит (http://example.com).

<form method="post" id="formid" action="">
<input type="checkbox" name="var" value="1">
<input type="checkbox" name="vars[]" value="2">
<input type="checkbox" name="vars[]" value="3">
<input type="submit" id="baton" name="baton">
</form>

<div id="result"></div>

<script>
$(function(){
$("#formid").change(function(e) {
    e.preventDefault();
    $.ajax({
        url: 'update.php',
        data: $(this).serialize(e),
        success: function(res) {
          $("#result").empty();
          $("#result").append(res);
        }
    });
});
});
</script>

Ответы (1 шт):

Автор решения: nazarpunk

const $form = document.getElementById(`formid`);
const $result = document.getElementById(`result`);

$form.addEventListener(`change`, () => {
  fetch($form.action, {
      body: new FormData($form)
    })
    .then(r => r.text())
    .then(text => $result.innerHTML = text)
});
<form method="post" id="formid" action="">
  <input type="checkbox" name="var" value="1">
  <input type="checkbox" name="vars[]" value="2">
  <input type="checkbox" name="vars[]" value="3">
  <input type="submit" id="baton" name="baton">
</form>
<div id="result"></div>

→ Ссылка