Page 1 of 1

live auto fill field based on other field content

Posted: 2019-09-28 12:32
by fgazza
Hello to all.
I have a "name" field and a "last _name" field
I have another surname_name field
I would like to make sure that when a user fills in the first and last_name fields the surname_name field fills up automatically concatenating surname and name
This should happen live by filling out the form before saving it and not after insert.
Can someone tell me the code to use?
THANKS!
Fabiano

Re: live auto fill field based on other field content

Posted: 2019-09-28 12:43
by jsetzer
You can use the .on("change", ...)-handler in TABLENAME-dv.js to detect the changes of both fields, "first_name" and "last_name". Create a function "updateName()". Whenever one of the inputs changes, call that javascript-function. That function should read both values by calling .val() on the inputs, then concat both values and set .text(newvalue) of the (reaonly) "full_name" field.

There is one task left: If "full_name" is readonly (which I recommend to avoid overwriting by users) it will not be available in $data on server side before/after insert/update. So you will have to concat both string on server side in your TABLENAME_after_insert() and TABLENAME_after_update() hooks, too. Concat the values from $data variable, for example $full_name = $data["first_name] . " " . $data["last_name], then update the record by using built-in sql("UPDATE ... SET full_name='{$full_name}' WHERE ...", $eo)-function in PHP.

That's it.
Best regards,
Jan

Re: live auto fill field based on other field content

Posted: 2019-09-29 08:05
by fgazza
thanks for the valuable suggestions.
Unfortunately I'm not good with the code.
Is it possible to have some help to create the code to insert in the table-dv.js file?
Thanks!

Re: live auto fill field based on other field content

Posted: 2019-10-01 18:50
by fgazza
Thanks to Reham and Uday now i have the code!!!

Here is the code:

function updateName() {
var name= $j( '#name' ).val(),
last_name= $j( '#last_name' ).val();
$j( '#full_name' ).text(last_name+' '+nome);
$j( '#full_name' ).val(last_name+' '+nome);


}

$j('#last_name,#name').on('change', function() {
updateName();
});

I have inserted it in a new file project_staff-dv.js n the hook folder and it work like a charm!!!