2016-01-24 87 views
1

我有一个JQuery UI自动完成问题:它只选择在字段(字符预选)中键入的文本的开始,而不是整个文本。例如:选择“stra”而不是“策略”。Jquery UI自动完成不会选择所有字段文本

这里是我的js代码:

$(document).ready(function() { 
    function doTag(iId, sLibelle) { 
     $.ajax({ 
     type: "GET", 
     url: "../../bobookmarks/content/json/put_tag_in_session.php", 
     contentType : "application/json; charset=utf-8", 
     dataType: "json", 
     data: {iId: iId, 
       sLibelle : sLibelle }, 
     success: function(data) { 
         if (data=="erreur") { 
          sErreur = "Une erreur est survenue"; 
          console.log(sErreur + "bo.js:L18"); 
          alert(sErreur); 
          return false; 
         }        
     }, 

     error: function(jqXHR, textStatus, errorThrown) { 
      var s = "Une erreur est survenue"; 
      alert(s);    
     } 
    }) 

    var sLi; 
    sLi = "<li class=\"tags\">"; 

    sLi += "<a href=\"#\" title=\"Supprimer ce tag\"><span class=\"label label-primary\">"+$("#tag").val()+"</span></a>"; 

    sLi += "<a href=\"#\" title=\"Supprimer ce tag\" class=\"form_ajout_tag_suppr\"><span class=\"glyphicon glyphicon-remove\"></span></a>"; 

    sLi += "</li>"; 

    $("#tags_liste").append(sLi);  

    $("#tag").val("");  
    return true; 
} // -- doTag() 

if ($("#tag").length > 0) {     
    $("#tag").autocomplete({ 
     minLength:3, 
     source: function(request,response) { 
        $.ajax({ 
         type  : "GET", 
         url   : "../../bobookmarks/content/json/get_tags.php", 
         contentType : "application/json; charset=utf-8", 
         dataType : "json", 
         data  : { term: $("#tag").val() }, 
         success  : function(data) { 
             if (data=="erreur") { 
              alert("Une erreur est survenue"); 
              return false; 
             } 

             response($.map(data, function(item) { 
              return { id: item.catv_num, 
                value: item.catv_v_libelle 
                }        
             }) // -- fin response 
             )}, // -- fin success 

         error: function(jqXHR, textStatus, errorThrown) { 
          var s = "Une erreur est survenue"; 
          console.log(s+" (bo.js:L74)");  
          alert(s); 
         } 
        }) // -- fin ajax 
     }, // -- fin source 

    });  

    $("#tag").on("autocompleteselect", function(event, ui) { 
     $("#tags_autocomplete_flag").val(1); 
     console.log("tags_autocomplete_flag val (dans autocompleteresponse) : "+$("#tags_autocomplete_flag").val());  
     doTag(ui.id, ui.value);  
    }); 

    $("#tag").blur(function() {   

     console.log("tags_autocomplete_flag val (entrée blur) : "+$("#tags_autocomplete_flag").val());  

      if ($("#tags_autocomplete_flag").val()==1) { 
      console.log("tags_autocomplete_flag val (blur(), conditon ==1) : "+$("#tags_autocomplete_flag").val());  
      // Le tag vient de la base (autocomplétion)  
      // la mise en session a déjà été traitée ci-dessus (L80 à 84) 
      // on remet le flag à 0   
      $("#tags_autocomplete_flag").val(0);    
     } else { // Le tag ne vient pas de la base 
      console.log("tags_autocomplete_flag val (si = 0 condition else) : "+$("#tags_autocomplete_flag").val());  
      doTag(0, $("#tag").val());   
     }   
    });    
} 
}); 

预先感谢您的帮助。

+0

你读过'minLength'的API细节了吗? – Twisty

+0

是的,我当然可以,但似乎并不是问题所在。 – user3049922

+0

那么最新的问题?这似乎是预期的行为,是键入3个字符后,自动完成将尝试找到可能的选择列表。 – Twisty

回答

0

当你拨打:

doTag(ui.id, ui.value);

这是没有得到正确的内容。如果您查看API,您将看到:

选择(事件,UI)类型:当从菜单中选择一个项目autocompleteselect 触发。默认操作是将文本字段的值替换为所选项目的值。

取消此事件可防止更新值,但 不会阻止菜单关闭。

事件

Type: Event 

UI

Type: Object 

项目

Type: Object 
An Object with label and value properties for the selected option. 

你应该叫:

doTag(ui.id, ui.item.value);

获得从自动完成列表中选择完整的价值。测试在这里:https://jsfiddle.net/Twisty/bpq3vxd1/

相关问题