const gameForm = document.getElementById("high-score-form")

gameForm.addEventListener("submit", (event) => {
    event.preventDefault()
    detailHighScore.innerText = `High Score: ${parseInt(event.target["score-input"].value)}`
  
    fetch(`http://localhost:3000/games/${1}`,{
        method:'PATCH',
        headers:{
            'Content-Type': 'application/json'
        },
        body:JSON.stringify({high_score:parseInt(event.target["score-input"].value)})
    })
    .then(respone => respone.json())
    .then(data => console.log(data))
})

<form id="high-score-form">
  <input id="score-input" type="text" />
  <input type="submit" />
</form>

So I am able to update the post information but every time I hit the submit button it refreshes even thought I have the event.preventDefault() if I take out the fetch request my event.preventDefault() works fine. Anyone know what is going on?