0

我已经设置好网格并且工作得很好。我想在 JqGrid 的表单视图中添加多个输入自动完成功能。多个自动完成功能有效，但 extractLast 功能似乎不起作用，我可以添加重复的输入。继承人的代码：

var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];
function split( val ) {
        return val.split( /,\s*/ );
        }
        function extractLast( term ) {
            return split( term ).pop();
        }
        function autocomplete_element(value, options) {
          // creating input element
          var $ac = $('<input type="text"/>');
          // setting value to the one passed from jqGrid
          $ac.val(value);
          // creating autocomplete
          $ac.autocomplete(
                {source: function( request, response ) {
                // delegate back to autocomplete, but extract the last term
                response( $.ui.autocomplete.filter(
                    availableTags, extractLast( request.term ) ) );
            },

                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;
                }
            });
          // returning element back to jqGrid
          return $ac;
        }
        function autocomplete_value(elem, op, value) {
          if (op == "set") {
            $(elem).val(value);
          }
          return $(elem).val();
        }

网格模型：

{
                ...
                editable: true,
                edittype: "custom",
                editoptions: {
                    custom_element: autocomplete_element,
                    custom_value: autocomplete_value
                }
            },

我从JQuery UI中找到的

和德国朗姆酒的博客

有什么建议么？

更新！

4

1 回答 1

0

看起来 jQuery UI 站点上的示例也允许多次选择相同的元素。问题出在source功能上——在创建建议列表时，它总是会根据所有可用术语检查最后一个术语。

修改select回调以仅显示那些尚未出现在字段中的术语。

source: function(request, response) {
  var terms = request.terms.split(/,\s*/);
  var last_term = terms.pop();

  var tags = $.grep(availableTags, function(el) {
    return $.inArray(el, terms) == -1);
  });

  response($.ui.autocomplete.filter(tags, last_term))
}
于 2012-05-21T08:24:26.577 回答