使用Jquery UI无法正常工作的多值自动完成功能

时间:2013-09-27 07:10:27

标签: jquery-ui jquery

我正在使用jquery Ui进行多值自动完成并且它工作正常但是在选择了第一个建议并且对于下一个请求它发送整个文本框值它没有拆分例如:假设在自动完成文本框中我键入'A'它给出建议现在,比如'ABC','ACB'以及更多的价值观 我将选择'ABC'并自动完成文本框看起来像'ABC',我会输入'B'听到它应该只向服务器发送'B'而不是发送'ABC,B'

听到我想要的是:在选择第一时间建议之后我应该发送''之后出现的请求,我该怎么办

这是我的代码

$(function() {

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

function extractLast( term ) {
    alert(term); 
    return split( term ).pop();
}

$( "#authorList" ).bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB &&
        $( this ).data( "ui-autocomplete" ).menu.active ) {
      event.preventDefault();
    }
  })
  .autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '${pageContext.request.contextPath}/catalogue/getMultiAuthor.action',
                dataType: "json",
                data:{"term":request.term},
                success: function (data) {
                response($.map(data, function (term) {
                        return {

                           label: 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;
    }
  });

});

1 个答案:

答案 0 :(得分:0)

您发送完整的字词是因为:data:{"term":request.term}

只需将其更改为data:{"term":extractLast(request.term)}

即可