逗号分隔的自动完成与jquery不工作的javascript json数据

comma separated auto complete with jquery not working with javascript json data

本文关键字:jquery 工作 javascript json 数据 分隔      更新时间:2023-09-26

我正在尝试创建一个逗号分隔的自动完成文本字段,该字段的自动完成json数据来自java脚本本身。。请参阅下面的代码:

java脚本数组:

   var remark = [
        "is under construction",
        "is a part of another construction.",
        "has acquired other work.",
        "Could not source construction."
    ];

自动完成方法:

   $("#remark").bind("keydown", function(event) {
        if (event.keyCode === $.ui.keyCode.TAB &&
                $(this).data("ui-autocomplete").menu.active) {
            event.preventDefault();
        }
    }).autocomplete({
        source: function(request, response) {
            $.getJSON(JSON.stringify(remark), { //this line is the issue..
                term: extractLast(request.term)
            }, response);
        },
        search: function() {
            var term = extractLast(this.value);
            if (term.length < 2) {
                return false;
            }
        },
        focus: function() {
            return false;
        },
        select: function(event, ui) {
            var terms = split(this.value);
            terms.pop();
            terms.push(ui.item.value);
            terms.push("");
            this.value = terms.join(",");
            return false;
        }
    });

助手功能:

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

CCD_ 1保存自动完成的数据以显示给用户。。。

CCD_ 2正在获取用于自动完成的数据。。功能,但这并不能像aspect ed.那样工作。而当我使用从mysql服务器获取数据时,这是有效的。。但是当我将它与java脚本数组一起使用时,它不起作用。。

任何帮助或建议都会很有帮助。。提前感谢。。。

source属性直接接受数组作为数据源。因此,您可以直接将本地数组传递给源属性:
var remark = [
"is under construction",
"is a part of another construction.",
"has acquired other work.",
"Could not source construction."];
$("#remark").bind("keydown", function (event) {
  if (event.keyCode === $.ui.keyCode.TAB && $(this).data("ui-autocomplete").menu.active) {
    event.preventDefault();
  }
}).autocomplete({
  source: remark,
  search: function () {
    var term = extractLast(this.value);
    if (term.length < 2) {
        return false;
    }
  },
  focus: function () {
    return false;
  },
  select: function (event, ui) {
    var terms = split(this.value);
    terms.pop();
    terms.push(ui.item.value);
    terms.push("");
    this.value = terms.join(",");
    return false;
  }
});
function split(val) {
  return val.split(/,'s*/);
}
function extractLast(term) {
  return split(term).pop();
}

工作Fiddle

这个链接对我有用http://jsfiddle.net/phpdeveloperrahul/zMWLx/

var masterdata=["abc","pqr","rst"];
 $(function() {
    function split( val ) {
      return val.split( /,'s*/ );
    }
    function extractLast( term ) {
      return split( term ).pop();
    }
    $( "#TestNames" ).autocomplete({
      source: function( request, response ) {
            response( $.ui.autocomplete.filter(
            masterdata, extractLast( request.term ) ) );
},
      select: function( event, ui ) {
                // Add the selected term appending to the current values 
with a comma
                var terms = split( this.value );
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push( ui.item.value );
                // join all terms with a comma
                this.value = terms.join( ", " );
                return false;
              },
      focus: function() {
               // prevent value inserted on focus when navigating the drop 
down list
               return false;
             }
    });
  });