Question

i am using jquery ui autocomplete in my tag textbox , its working fine but the problem is that it gives suggestion only one time , for example first time when i enter a character it shows suggestion i select something from suggestion and it append that in text box with a comma but when i again enter a character it doesn’t show anything

my code is following

JQUERY

 function split(val) {
        return val.split(/,\s*/);
    }
    function extractLast(term) {
        return split(term).pop();
    }

    $("#tagsss")
    // don't navigate away from the field on tab when selecting an item
        .bind("keydown", function (event) {
            if (event.keyCode === $.ui.keyCode.TAB &&
                    $(this).data("autocomplete").menu.active) {
                event.preventDefault();
            }
        })
        .autocomplete({
            minLength: 0,
            source: function (request, response) {
                $.ajax({
                    url: "/Home/LookUpTag",
                    dataType: "json",
                    data: "searchterm=" + request.term,
                    success: function (data) {
                        response($.map(data, function (item) {
                            //  alert(data.length);
                            return {
                                label: item.Name,
                                value: item.Name,
                                Name: item.Name
                            };
                        }));
                    }
                });
            },
            focus: function () {
                // prevent value inserted on focus
                return false;
            },
            select: function (event, ui) {
                var terms = split(this.value);
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push(ui.item.value);
                // add placeholder to get the comma-and-space at the end
                terms.push("");
                this.value = terms.join(",");
                return false;
            }
        });

My function in controller

Controller

public JsonResult LookUpTag(string searchterm)
    {

        var tags = context.tagService.Query().Where(x => x.name.Contains(searchterm)).Select(x => x.name).ToList();
        var list = tags.Select(item => new SearchJsonModel
        {
            Name = item,
            Value = item
        }).Select(model => (model)).ToList();
        return Json(list, JsonRequestBehavior.AllowGet);
    }

i worked alot on it but not found any error , Please tell me whats wrong in this code . Thanks in advance

Answer 1

Not sure but have you missed to call your extractLast() to retrieve the last term in the input?

The source param

source: function (request, response) {
                $.ajax({
                    url: "/echo/json/",
                    dataType: "json",
                    data: "searchterm=" + extractLast(request.term),
                    success: function (data) {
                        response($.map(data, function (item) {
                            //  alert(data.length);
                            return {
                                label: item.Name,
                                value: item.Name,
                                Name: item.Name
                            };
                        }));
                    }
                });
            }