У меня есть типы входных данных для флажка, и когда я выполняю методы удаления или получения, он работает, но страница не перезагружается

function takeIds(event) {
  const container = $(this).closest('.message-container');
  const checks = container
    .find('input[type = "checkbox"]')
    .filter(':checked');
  let info = `<div>${container.data("postaddress")}</div><div>${( !checks.length ? "Nothing checked!" :
    `Good: ${checks.length} checked!`)}</div>`;
  $('.information')
    .toggleClass('error', !checks.length)
    .html(info);

  if (!checks.length) {
    return;
  }
  // could do this or the map only
  //let selected = [];
  //checks.each(function() {
  //   selected.push($(this).val());
  //});
  let selected = checks.map((i, ck) => ck.value).toArray();
  let messageIds = selected;
  $('.information')
    .toggleClass('error', false)
    .html($('.information').html() + `[${messageIds}]`);
  $.ajax({
    url: container.data("postaddress"),
    type: 'POST',
    dataType: 'json',
    data: messageIds,
    timeout: 10000
  }).done(function(result) {
    let msg = `<div>AJAX Success:${JSON.stringify(result)}</div>`;
    if (result.ok) {
      msg = msg + "<div class='error'>We are good here we will reload shortly...</div>";
      setTimeout(() => {
        window.location.href = window.location.href;
      }, 5000);

    } else {
      msg = msg + '<div>Mesaj geri alma işlemi başarısız oldu. Woops</div>';
      // alert('Mesaj geri alma işlemi başarısız oldu.');
    }
    $('.information')
      .toggleClass('error', false)
      .html($('.information').html() + msg);
  }).fail(function(jqXHR, textStatus, errorThrown) {
    let msg = `<div>AJAX Error:${textStatus}Error:${errorThrown}</div>`;
    $('.information')
      .toggleClass('error', true)
      .html($('.information').html() + msg);
    // alert('Bir hata oluştu.');
  });
}
$('.message-container').on('click', '.testerout', takeIds);

/* below here is my fake ajax mock 
  I did not invent this. Leveraged some info from here https://stackoverflow.com/q/5272698/125981 */
function mockAjax(options) {
  var that = {
    done: function done(callback) {
      if (options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    },
    fail: function error(callback) {
      if (!options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    }
  };
  return that;
}
/* Then override api call without touching $.ajax: */
WriterPanelMessage = function() {
  return mockAjax({
    success: true,
    timeout: 500,
    response: {
      results: {
        result: 'Ok'
      }
    }
  });
};
/* Then override api call without touching $.ajax: */
WriterPanelMessage = function() {
  return mockAjax({
    success: false,
    timeout: 500,
    response: {
      results: {
        result: 'Oh No'
      }
    }
  });
};

$.ajax = function() {
  return mockAjax({
    success: true,
    response: {
      ok: true
    },
    timeout: 500
  });
};

body {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-size: 16px;
  display: grid;
  place-items: center;
  gap: 0.5em;
}

.message-container,
.information {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 2em;
  align-items: center;
  gap: 0.5em;
  justify-content: center;
  border: solid 1px #00FF00;
  background-color: #00FF0040;
  border-radius: 1em;
  padding: 0.5em;
}

.message-container .testerout {
  border-radius: 2em;
  padding: 0.5em;
}

.information>* {
  border-bottom: 1px solid;
}

.information.error,
.information .error {
  border: solid 1px #FF0000;
  background-color: #FF000010;
}

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<!-- actual <div id = "checkDiv" class = "message-container" data-postaddress = "@Url.Action("RetrieveMessage", "WriterPanelMessage")">-->
<div id = "checkDiv" class = "message-container" data-postaddress = "WriterPanelMessage\RetrieveMessage">
  <label><input type = "checkbox" value = "cheers"/>Cheers</label>
  <label><input type = "checkbox" value = "speech"/>Speeches</label>
  <label><input type = "checkbox" value = "yells"/>Yells</label>
  <label><input type = "checkbox" value = "whisper"/>Whisper</label>
  <label><input type = "checkbox" value = "quiet"/>Silence</label>
  <button class = "testerout" type = "button">Test Our Code</button>
</div>
<div class = "information"></div>