How to correctly pass id from controller to jquery autocomplete?

Question

JavaScript

Hello, I'm trying to implement a simple search on my site, the search goes through a table in the database, I decided to try jquery autocomplete so that when you enter a list of names from the database, it all worked out (loads the text from the database). Now I'm interested in how to make this drop-down list so that all items become links, but not just links, but so that they go to pages with the corresponding id. For example Michael in the Table from a DB has id = 12 . We enter in the field Michael , click on it and we are thrown to the page /Details/12 . John id = 1 . We enter it and throws us at /Details/1 . Like in an online store in general. Here are my methods from controller

public JsonResult Search(string term)
        {

            var data = db.employees.Where(p => p.Name.StartsWith(term))
                .Select(p => p.Name).ToList();

            return Json(data, JsonRequestBehavior.AllowGet);
        }


        public ActionResult Details(int id)
        {
            var data = db.employees.Find(id);
            return View(data);
        }

Here is the jquery code( if specified in url.actionnew { id = Model.Id}

$( function() {
    $( "#tags" ).autocomplete({
        source: '@Url.Action("Search", "Test")',
        select: function (event, ui) {
            var targetUrl = '@Url.Action("Details", "Test")';
            window.location.href = targetUrl;
        }
       
        });
    });

then I will get the error "The reference to the object does not point to an instance of the object." How to correctly pass the id here so that when we click on the menu item, we are thrown to the page on the id of which we clicked ??