如何使用自动完成jquery 3相同的类

时间:2016-07-06 06:46:27

标签: javascript jquery asp.net-mvc jquery-ui autocomplete

我使用jqueryui autocomplete iwant是一些输入文本的相同工作 但是当我使用$(this).val()表示文本框的发送值时,它显示错误,当我使用时(" .Degree")。val()显示并向服务器发送第一个文本框不正确

function DegreeAutoComplete() {

        $(".Degree").autocomplete({

            position: { my: "right top", at: "right bottom", collision: "none" },
            source: function (request, response) {

                var spin = $(".spinnerDegree");
                spin.addClass("fa-spin fa-spinner");

                $.ajax({
                    url: "@Url.Action("GetDegree")",
                    type: "POST",
                    dataType: "json",
                    data: { search: $(".Degree").val() },
                    success: function (data) {

                        spin.removeClass("fa-spin fa-spinner");
                        response($.map(data, function (item) {
                            return { label: item.PersianName, value: item.PersianName, id: item.Id };
                        }));

                    }
                });
            },
            messages: {
                noResults: '',
                results: function (resultsCount) { }
            },
            select: function (event, ui) {

                // ui.item.value contains the id of the selected label
                alert($(this).val());
                $(this).attr("sel", ui.item.id);

            }
        });
    }

当我使用时:$(this).val();

  

elem.nodeName未定义

hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[elem.nodeName.toLowerCa...

我该如何解决呢?

1 个答案:

答案 0 :(得分:0)

this指的是其中的ajax对象。在内部范围内使用之前保存this参考。

var spin = $(".spinnerDegree");
spin.addClass("fa-spin fa-spinner");
var $that = $(this);// save reference
$.ajax({
    url: "@Url.Action("
    GetDegree ")",
    type: "POST",
    dataType: "json",
    data: { search: $that.val() },//use $that var here
    success: function(data) {

        spin.removeClass("fa-spin fa-spinner");
        response($.map(data, function(item) {
            return { label: item.PersianName, value: item.PersianName, id: item.Id };
        }));

    }
});

修改 刚查过jquery UI doc 你应该使用它request.term

source: function(request, response) {
    $.ajax({
        url: "@Url.Action("GetDegree")",
        type: "POST",
        dataType: "json",
        data: {
            search: request.term
        },
        success: function(data) {
            //....
        }
    });
}