JSFiddle - React, Tailwind, and code Playground

HTML

<form id="gameData" action="http://espn.com" method="post">
  
  Name: <input id="txtName" type="text">
  
  <input type="submit"><span id="err"></span>
</form>

JavaScript

var frm = document.getElementById("gameData"); // This is the form element
var name = document.getElementById("txtName");
var err = document.getElementById("err");

// Event handlers are automatically passed a reference to the
// event that triggered the handler. You must remember to set up
// a function argument to capture that reference. Here, that is "evt"
frm.addEventListener("submit", function(evt){

  // Using whatever logic you deem necessary, proceed or cancel:
  if(txtName.value === ""){
  console.log("err");
    // There is a problem:
    evt.preventDefault();  // cancel the event
    evt.stopPropagation(); // prevent it from propagating to other elements  
    
    err.textContent = "E R R O R !";  
  }

});