Question

在我的表单中有一个自动填充文本框。

我从这个文本框中选择多个值，如下所示..

701702703，

每件事都很好。

但问题是文本框也接受那些不在数据库中的值或不在自动完成列表中的值。

例如我的表有3个值：

700
701
702

此值出现在自动填充文本框中...

但如果用户输入700,701,702,1000000，

**此值1000000不在数据库中**

这就是为什么我需要问你是否有任何脚本或代码或javascript使我的文本框只接受那些仅在自动完成列表中的值。

下面是我的代码和脚本......

<input id="tags" type="text" class="field size2"  name="used_receipt">


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script>
$(function() {
var availableTags = [
<?php 
$receipt = $database->getRows("SELECT DISTINCT SM.receipt_no FROM scheme_master SM Inner join book_issue BI ON BI.book_no = SM.Book_no2  where SM.receipt_no not in (select used_receipt from book_return)"); 
foreach($receipt as $row){ ?>
"<?php echo $row['receipt_no']; ?>",
<?php } ?>
];
function split( val ) {
return val.split( /,\s*/ );
}
function extractLast( term ) {
return split( term ).pop();
}

$( "#tags" )
// don't navigate away from the field on tab when selecting an item
.bind( "keydown", function( event ) {
if ( event.keyCode === $.ui.keyCode.TAB &&
$( this ).data( "ui-autocomplete" ).menu.active ) {
event.preventDefault();
}
})
.autocomplete({
minLength: 0,
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;
}
});
});
</script>

Answer 1

我担心你必须编写自己的代码才能做到这一点。

您可以做的是将事件“模糊”添加到您的输入中，当它触发时（这意味着它失去焦点），您检查值以查看是否允许它。

$("#tags").on("blur", function(){
    if (availableTags.indexOf($(this).val()) == -1)
    {
        //Not allowed:
        $(this).val("");
        //You could also put a warning here or something.   
    }
});

php代码或脚本，用于接受来自自动完成列表的文本框中的值

1 个答案: