Question

场景我有一个文本字段，用户可以在其中搜索并选择自动完成功能，其中从数据库中检索项目列表。用户可以选择添加更多行并选择更多项目。到目前为止，这是有效的，但我希望对数据输入实现更多控制。

目标

从建议的自动填充列表中删除项目（如果已在前一行中选择了该项目。）
如果用户决定手动键入项目编号，请清除文本框，如果（1）输入项目已存在于先前字段中，或（2）输入项目不在建议列表中。（用户有时决定在项目编号较短时手动输入，但按字母顺序排列在建议列表的底部）

文字字段

<input type="text" data-type="Item_ID" class="form-control autocomplete_tab" id="item" name="Item[]" placeholder="Item">

用户可以使用按钮添加新行。仅显示与文本字段相关的代码：

function addnewrow() {
    var n = ($('.detail tr').length-0)+1;       
    var tr ='<tr>'+
                '<td class="no">' + n +'</td>'+
                '<td><p id="cyldiv" class="ui-widget">'+
                '<input type="text" data-type="Item_ID" class="form-control autocomplete_tab" id="item" name="item[]" placeholder="Item"></td>'+                
                '<td><a href="#" class="remove">Delete</td>'+
            '</tr>';
            $('.detail').append(tr);
}

自动填充代码：

$(document).on('focus','.autocomplete_tab',function(){
type = $(this).data('type');
if(type =='Item_ID' )autoTypeNo=0;  
$(this).autocomplete({
    source: 'search.php',
    autoFocus: true,            
    minLength: 0        
}).focus(function () {
            if(this.value==""){
                $(this).autocomplete("search");
            }
        })

});

search.php中的代码

<?php
require 'db/connect.php';   

$searchTerm = $_GET['term'];

$query = $cn->query("SELECT Name FROM item_list_temp WHERE Name LIKE '%".$searchTerm."%'  ORDER BY Name ASC");
while ($row = $query->fetch_assoc()) {
    $data[] = $row['Name'];
}

echo json_encode($data);
?>

在其他字段中禁用所选的自动完成选项

0 个答案: