Jquery multiple autocomplete textbox with data from database

I am trying to recreate this one from jquery https://jqueryui.com/autocomplete/#multiple

This function allows you to select a multiple data using textbox that acts like a dropdown. I am now recreating it, but this time, I want my data from database. I have recreated it to this syntax but it is not working. Any suggestion on how can I make it work? Thank you in advance

views:

  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>

  <input id="names" size="50">

  <script>
    $(function() {
        function split(val) {
            return val.split(/,s*/);
        }

        function extractLast(term) {
            return split(term).pop();
        }
        $('#names').autocomplete({
            minLength: 4,
            source: function(request, response) {

                $.ajax({

                    url: controller/groupnames,
                    data: {
                        term: extractLast(request.term)
                    },
                    dataType: json,
                    type: POST,
                    success: function(data) {
                    console.log(data);
                        response(data);
                    },
                    error: function() {
                      
                        response($.ui.autocomplete.filter(
                            [opt1,opt2]
                            , extractLast(request.term)));
                    }
                });
            },
            focus: function() {
               
                return false;
            },
            select: function(event, ui) {
                var terms = split(this.value);

           
                terms.pop();

            
                terms.push(ui.item.value);

             
                terms.push();
                this.value = terms.join(,); // I have an error here. It says that my comma is unexpected token
                return false;
            }
        });
    });
  </script>

Controller:

 function groupnames(){
        

            $data=$this->db->query("SELECT * FROM `users`");
            
            foreach($data->result() as $row){
                
                 $row->name;
                

                
            }
            
            echo json_encode($data);
            
            
            
            
     
    }

My data (This is the data that i want for my autocomplete function):

    var data= [
      "John",
      "Mark",
      "Doe",
    ];