Question

basically I have two input fields, “name” and “username”.

The idea is that the “username” field will change depending on what is entered into the “name” field – dynamically. I also need the username field to be in lowercase only and to change spaces into dashes. I was thinking using onkeydown but I couldn’t get it to do anything.

I’ve been looking around, but can’t seem to find what I’m looking for. Anyone got any ideas?

<input type="text" name="name" id="name" class="field" />
<input type="text" name="username" id="username" class="field" />

^^ basic form inputs.

EDIT:

Here’s the code I got working, if anyone else is looking for something like this:

function fill_username(value) {
  $("#username").val(value);
}
$("#client-name").keyup(function() {
  var value = $(this).val();
  var value = value.replace(/\s+/g, '-').toLowerCase();
  fill_username(value);
});

Answer 1

You could set keyup event:

$('#name').keyup(function() {
  fill_username();
});

This will be called every time user enters one letter in name field.