I have a timeline element on a page which users can post comments on and tag other user.
The issue i am having is when users are tagged by @name a select list pops up and you can select the user you want to tag, i wanted it similar to whatsapp but its all gone wrong. If i start typing then tag someone it returns @namenamename the more i type the longer the tag @namenamenamenamenamenamenamenamenamename and so on. Ideally when the user is selected i would like the word starting with the @character replacing
I've tried searching for a solution but cant find anything
Here is the script i have
$(window).on('load',function(){
$('#notesbody').scrollTop($('#notesbody')[0].scrollHeight);
});
$(document).on('keypress','#notes-input',function(e){
if(e.which==64){
$('#userlist').removeClass('d-none');
}
});
$(document).on('click','#userlist', function(e){
const username = $(this).find('option:selected').val();
//username = $(this).val();
//$('#notes-input').val($('#notes-input').val() + username);
$('#notes-input').val() = $('#notes-input').replaceWith('/@([a-z0-9_]+)/i', username);
$('#userlist').addClass('d-none');
$('#notes-input').focus();
});