Field to autofill based on other form fields

As a user is filling out a form in the app, I would like another field to populate with that information as they are typing it. For example, when they type in the First Name and Last Name fields it would populate automatically into another text field to capture it real time.

I know I can use a text formula field but that does not populate as a form is being completed. That happens only after form submission.

Example

First Name: Sally
Last Name: Testing
Text field to auto-populate: SallyTesting

Thanks!

Real time capture needs javascript. A coder can do it for you. Have you utilised the experts network? Knack Experts Network has coders in it.

Thanks I can give that a try. I had searched to see if there was anything out there already and couldn’t find anything.

I used the following code to keyup a field as users type in another:

$(document).on(‘knack-view-render.view_000’, function (event, view, data) {
$(‘#field_001’).attr(‘disabled’, ‘disabled’);
$(“#field_000”).keyup(function(){
$(“#field_001”).val(this.value);
});
});

Replacing view_000 with the view number of your form you want to use it;
the field_001 with the auto-populate field number;
and the field_000 with the name field number (I am assuming you used one field with type ‘name’)

note: the second line $(‘#field_001’).attr(‘disabled’, ‘disabled’); can be skipped if you still want your users to edit the auto populate field.

Hope it helps
Marcos

This works great thank you! However, my name fields are two separate fields that need to be combined into one while user is typing (and if possible put a period between the first name and last name)

in that case, this should work:

$(document).on(“knack-view-render.view_569”, function (event, view, data) {
let first = $(‘#field_498’);
let last = $(‘#field_499’);
let outputField = $(‘#field_500’);
let firstOutputValue;
let lastOutputValue;
outputField.attr(“disabled”, “disabled”);
first.keyup(function(){
if (lastOutputValue == undefined) {
outputField.val(this.value);
firstOutputValue = this.value;
} else{
outputField.val(this.value + “.” + lastOutputValue);
firstOutputValue = this.value;
}
});
last.keyup(function(){
outputField.val(firstOutputValue + “.” + this.value);
lastOutputValue = this.value;
});
});

I had to add if statement in case users go back and forward between field (typing first, then last, then correcting a misspell in first, etc)
I placed a period in between with no spaces. you should be able to add spaces on the two statements if you want,
Don’t forget to replace view_### and field_###s with yours
Cheers,

You are amazing! This worked perfectly - I can’t thank you enough!