jQuery UI Autocomplete | Server Side

<title>jQuery UI Autocomplete | Server Side</title>

 

<script src="Scripts/Jquery-ui/js/jquery-1.9.1.js" type="text/javascript"></script>

<script src="Scripts/Jquery-ui/js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>

<link href="Scripts/Jquery-ui/css/ui-lightness/jquery-ui-1.10.3.custom.css" rel="stylesheet"/>

<scripttype="text/javascript">

    $(document).ready(function() {

        $("#txtState").autocomplete({

            source:function(request, response) {

                $.ajax({

                    type:"GET",

                    url:"https://localhost:44342/States/Search",

                    data: { query: $("#txtState").val() },

                    dataType:"json",

                    contentType:"application/json; charset=utf-8",

                    success:function(data) {

                        response(data);

                    },

                    error:function(data) {

                        alert("error found");

                    }

                });

            }

        });

    });

</script>

<div>

    <inputtype="text"id="txtState"/>

</div>

public class StatesController : Controller
{
    [HttpGet]
    public IActionResult Search(string query)
    {
        List<string> list = null;
        if (!string.IsNullOrEmpty(query))
        {
            list = GetAllStates().Where(i => 
                    i.Contains(query, StringComparison.OrdinalIgnoreCase)).ToList();
        }
        return Json(list);
    }

    private List<string> GetAllStates()
    {
        return new List<string>() {
        "Andhra Pradesh", "Arunachal Pradesh", "Assam", "Bihar",
        "Chhattisgarh", "Goa", "Gujarat" , "Haryana", "Himachal Pradesh",
        "Jammu and Kashmir", "Jharkhand", "Karnataka" , "Kerala", "Madhya Pradesh",
        "Maharashtra", "Manipur", "Meghalaya" , "Mizoram", "Nagaland", "Orissa",
        "Punjab", "Rajasthan", "Sikkim" , "Tamil Nadu", "Tripura", "Uttar Pradesh",
        "Uttarakhand", "West Bengal"
        };
    }
}