Wednesday, September 19, 2018

Autocmplete Text Box in mvc using entity framework with some extra information.


On View:

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/start/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>
<script type="text/javascript">
    $(document).ready(function () {
        $("#customer").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "/AppointmentList/customerlist",
                    type: "POST",
                    dataType: "json",
                    data: { searchtxt: request.term },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item.Name, value: item.Name, id: item.CustomerID };
                           
                        }))

                    }
                })
            },
            messages: {
                noResults: "",
                results: function (count) {
                    return count + (count > 1 ? ' results' : ' result ') + ' found';
                }
            },
            select: function (e, i) {
                $("#ContactPerson").val(i.item.id);
            }
        });
    })
</script>

On Controller:

 [HttpPost]


        public JsonResult customerlist(string searchtxt)
       {
            var customerlist = crmapp.customers.Where(x => x.Name.StartsWith(searchtxt.ToLower()));
            return Json(customerlist, JsonRequestBehavior.AllowGet);
        }

No comments:

Post a Comment