Get Data from Input Field into Fetch Request in JavaScript

Question

I am trying to get the data from a text field into my fetch request so that I can get a response from an API. The data should be sent to the fetch request onsubmit or onchange

How can I go about it?

HTML:

<div class="input-field">
    <input type="text" id="data" placeholder="submit token">
</div>

JS:

function dataFetch(url) {

  const data = document.getElementById("data").value;
  const myHeaders = { "x-data-token": data,
"x-data-access": "all-access")
}

  const requestOptions = {
    method: "GET",
    headers: myHeaders,
  };

  fetch(url, requestOptions)
    .then((res) => (res.ok ? res.json() : Promise.reject(res)))
    .then((data) => {