0

I was trying to use Twitter Typeahead.js in my application.But it didnt seem to work.I think I am missing some line of code anywhere but cant figure out where I have went wrong.

Script Reference

<script src="~/plugins/typeahead/typeahead.bundle.min.js"></script>

HTML

 <input type="text" class="form-control typeahead" id="txtRegNo" data-url="@Url.Action("RegistrationNoSearch")">

JS Code

    $(function () {           
        var RegNoSearch = new Bloodhound({
            datumTokenizer: function (datum) {
                return Bloodhound.tokenizers.whitespace(datum.value);
            },
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url: $("#txtRegNo").data("url"),
                filter: function (datas) {
                    return $.map(datas.results, function (data) {
                        return {
                            value: data.RegNo,
                            id: data.RegId
                        };
                    });
                },
                ajax: {
                    type: 'POST',
                    data: {
                        param: function () {
                            return $('#txtRegNo').val();
                        }
                    },
                    context: this
                }
            }
        });

        // Initialize the Bloodhound suggestion engine
        RegNoSearch.initialize();

        $('#txtRegNo .typeahead').typeahead({

            highlight: true,
            minLength: 1
        },
        {
            name: 'states',
            displayKey: 'value',
            source: RegNoSearch.ttAdapter()
        });
    });

Controller Code

  [HttpPost]
    public JsonResult RegistrationNoSearch(string regNo)
    {
        try
        {
            List<clsRegistrationNoSearch> _lstRegNoSearch = new List<clsRegistrationNoSearch>();
            _lstRegNoSearch = _db.StudentRegistrations
                            .Where(r => r.RegistrationNumber.StartsWith(regNo))
                            .Select(r => new clsRegistrationNoSearch
                            {
                                RegId=r.Id,
                                RegNo=r.RegistrationNumber
                            }).ToList();
            return Json(_lstRegNoSearch, JsonRequestBehavior.AllowGet);
        }
        catch (Exception ex)
        {
            return Json(null);
        }
    }
ksg
  • 3,927
  • 7
  • 51
  • 97

0 Answers0