Translate

Tuesday, 21 April 2015

Auto complete textbox In mvc asp.net

       public ActionResult Auto()
        {
            return View();

        }


IN view

<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.11/jquery-ui.min.js"
    type="text/javascript"></script>
<script>
    $(document).ready(function () {
        $("#user").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '@Url.Action("Autocomplete", "JqGrid")', type: "POST", dataType: "json",
                    data: { query: request.term },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item.UserName, value: item.UserName };
                        }))
                    }
                })
            },
            messages: {
                noResults: "", results: ""
            }
        });
    });
</script>

In controller

public ActionResult Autocomplete(string query)
        {
var users = context.UserInfoes.Where(u =>  u.UserName.Contains(query)).ToList();
            return Json(users);
        }


The result Below




No comments:

Post a Comment