自動完成：我如何使用像Facebook一樣的自動完成功能？

Question

我已經嘗試過textcomplete，但我真的面臨一個問題，我只能在select上設置單個值。

在自動完成中，我知道如何設置多個值。但不知道我怎麼能轉換它，如下面圖片...

您也可以回頭看看我在textcomplete試圖在這裏 - Text Complete Query

Answer 1

首先你需要包括自動完成js和css。

這裏是鏈接 https://blog.jqueryui.com/2015/03/jquery-ui-1-11-4/

包括jQuery的UI JS和jQuery-UI CSS

$("#txtSeller").on('keyup', function(e){ 
var currentObj = $(this); 
jQuery("#txtSeller").autocomplete({ 
    source: function(request, response) { 
     var postData = { 
      "operation":"search", 
      "sellerName": currentObj.val()//sending the name to backend 
     } 

     $.ajax({ 
      type: "POST", 
      cache: false, 
      url: "controllers/admin/put_orders.php", 
      datatype:"json", 
      data: postData, 

      success: function(dataSet) { 
       response($.map(JSON.parse(dataSet), function (item) { 
        return { 
         id: item.id, 
         value: item.name 
        } 
       })); 
      }, 
      error: function(){ 

      } 
     }); 
    }, 
    select: function (e, i) { 
     var sellerId = i.item.id; 
     currentObj.attr("seller-id", sellerId); 
     $("#txtSeller").val(i.item.value); 
    }, 
    minLength: 3 
}); 

}）;

這裏是自動完成的完整代碼。

請你寫這個Ajax調用SQL查詢不要忘了LIKE參數寫在SQL查詢