I want to apply Jquery UI Autocomplete with multiple values to one registration forms

Question

0

Asked: May 23, 20262026-05-23T22:09:58+00:00 2026-05-23T22:09:58+00:00

I want to apply Jquery UI Autocomplete with multiple values to one registration forms

0

I want to apply “Jquery UI Autocomplete with multiple values” to one registration forms input field.
What i want to do exactly: When visitor types name of existing user to this input field, first of all, script searches for name existence, completes it (if exists), adds comma. User can type second, third… existing usernames to this field, and everytime script will auto complete. And when visitor clicks to submit button, PHP searches for id’s of this usernames, creates array of id’s, adds it to new users “friends” field in db table.

My code:

HTML

<form action="index.php" method="post">      
<input class="std" type="text" name="friends"  id="friends"/>
<input type="submit" name="submit">
</form>

Jquery

$(function() {
    function split( val ) {
        return val.split( /,\s*/ );
    }
    function extractLast( term ) {
        return split( term ).pop();
    }

    $( "#friends" )
        // don't navigate away from the field on tab when selecting an item
        .bind( "keydown", function( event ) {
            if ( event.keyCode === $.ui.keyCode.TAB &&
                    $( this ).data( "autocomplete" ).menu.active ) {
                event.preventDefault();
            }
        })
        .autocomplete({
            source: function( request, response ) {
                $.getJSON( "search.php", {
                    term: extractLast( request.term )
                }, response );
            },
            search: function() {
                // custom minLength
                var term = extractLast( this.value );
                if ( term.length < 2 ) {
                    return false;
                }
            },
            focus: function() {
                // prevent value inserted on focus
                return false;
            },
            select: function( event, ui ) {
                var terms = split( this.value );
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push( ui.item.value );
                // add placeholder to get the comma-and-space at the end
                terms.push( "" );
                this.value = terms.join( ", " );
                return false;
            }
        });
});

search.php

$conn = mysql_connect("localhost", "user", "pass")  or die( mysql_error() );;
mysql_select_db("db", $conn)  or die( mysql_error() );;
$q = strtolower($_GET["term"]);
if (!$q) return;
$query = mysql_query("select id, fullname from usr_table where fullname like '$q%'")  or die(mysql_error());
$results = array();
while ($row = mysql_fetch_array($query)) {$results[] = array ( "id" => $row[0] , "label" => $row[1], "value" => $row[1] );}
echo json_encode($results);

My questions:

I need only id of written name,
and fullname. I don’t need value.
How can i delete it from jquery
code?
how to fetch array of id’s
of written names, and put to
“friends” field of usr_table after
submission of registration form?
And finally i want to realise it
with mysqli. Which parts of code i
must change?

Sorry for my bad
english