JQuery Autocomplete plugin

JQuery files

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>


<input class="input ui-autocomplete-input" data-val="true" data-val-required="Please select receiver!!" id="txtboxid" maxlength="50" name="txtboxid" placeholder="enter search text" type="text" value="" autocomplete="off">

Your JQuery code

$(document).ready(function () {

    $("#txtboxid").autocomplete({
     
        source: function (request, response) {
            $.ajax({
                url: 'GetListMatchesToTheSearchText',
                type: "POST",
                dataType: "json",
                data: { searchdata: request.term },

                success: function (data) {
                    response($.map(data, function (item) {
                        return { label: item.UserName, value: item.UserName, Id: item.UserId };
                    }))
                }
            })
        },
        messages: {
            noResults: "", results: ""
        },
        select: function (event, ui) {        
            $('#labelcontrolid').val(ui.item.UserName);
        }
    });
});



Server side code to fetch the list

 public ActionResult GetStudentListMatchesToTheSearchText(string searchdata)
        {
            List<Student > ListStudent  = new List<Student>();

            ListStudent = FetchSutudentData(searchdata); // Method to fetch the student list

            return Json(ListStudent , JsonRequestBehavior.AllowGet);
        }


public class Student
(
           public int Id{get;set;}
           public string UserName{get;set;}
)