html
<tr>
<td class="pro_ltd"><font class="red">*</font> 选择产品:</td>
<td colspan="2"><{input type="text" vtype="required" "updateList();" "updateList();" "checkBu(this);" onChange="selectDoc(goods_id)" list="bu" id="buinput" autocomplete="off" maxlength="1000" style="width:20%" value=$goods_name}>
<input type="hidden" list="buid" id="buid" name="apply[goods_id]" value=<{$apply.goods_id}>></td>
<datalist id="bu"></datalist>
<ul id="bu-data" style="display:none;">
<{foreach from=$goods_list item="applys"}>
<li><{$applys.name}></li>
<input value="<{$applys.goods_id}>" type="hidden">
<{/foreach}>
</ul>
</tr>
js
if (sign) {
$("buinput").disabled = true;
}
function checkBu(input){
//如果输入符合要求,正常,否则清空
if (!options.get('text').contains(input.value) && input.value != '') {
input.value='';
Message.error('此产品不存在');
}
}
var options = $('bu-data').getChildren('li');
var optionsid = $('bu-data').getChildren('input');
function updateList(){
var input = $('buinput');
var temp = '';
var j = 0;
for (i = 0;i < options.length; i++) {
if ((input.value == '' || options[i].get('text').test(input.value)) && j<10) {
temp = temp + '<option>' + options[i].get('text') + '</option>';
tempid = optionsid[i].value;
j++;
if(input.value == options[i].get('text'))
{
$('buid').value = tempid;
goods_id = tempid;
goods_name = options[i].get('text');
}
}
}
console.log($('buid').value);
$('bu').set('html', temp);
}