Instead of the value of the input, the value of the variable was sent, how to implement it?

Question

JavaScript

It is necessary that in the form, instead of the input value, the value of the variable bound to the value of the input is sent, and the value of the input is not sent. For example, there is an input, I enter my name into it, but the position of my name in the list of names should be sent to the server, and the name itself should not be sent anywhere. How can this be implemented?

Answer 1

Is there any code? Without a code, it's like poking a finger into the sky. But, you can use something like this.

<form action="some_url" method="POST">
  <input type="text" name="username">
  <button>Submit</button>
</form>

const form = document.querySelector('form');
const users = ['John', 'Emily', 'Bruce', 'Alice'];

form.addEventListener('submit', event => {
  const input = form.querySelector('input[type="username"]');
  const index = users.indexOf(input.value);

  if (index === -1) {
    event.preventDefault();
  } else {
    input.value = index;
  }
});

UPD : React example .