我有搜索输入框,用户输入一些字符然后弹出建议列表,当用户从列表中选择项目时,数据会在某些字段中自动填充。我在搜索框中使用了Awesomplete widget。
HTML
<input data-list="Samuel Mendoza, Bowie Tarren" class="awesomplete" style="display:inline-block;width: 371px; font-weight:bold;z-index:0"/>
<button class="fa fa-search" type="button" style="border:none;background-color: #ffffff; margin-left: -33px; color: #dedede;position:relative; z-index:1"></button>
JS
$(document).ready(function () {
$(".awesomplete").change(function () {
var pt_name = $('.awesomplete').val();
if(pt_name == "Samuel Mendoza"){
document.getElementById("first_name").value = "Samuel";
document.getElementById("middle_name").value = "Ariel";
document.getElementById("last_name").value = "Mendoza";
document.getElementById("nickname").value = "Same";
$("#gender").val('1');
document.getElementById("dob").value = "18 Dec 1977";
document.getElementById("street_1").value = "14 Tall Acres Drive";
document.getElementById("street_2").value = "";
document.getElementById("city").value = "Spring";
$("#state").val('1');
document.getElementById("postal_code").value = "77387";
document.getElementById("tel").value = "713-251-2721";
document.getElementById("email").value = "smendoza@protonmail.com";
document.getElementById("mrn").value = "2457324";
document.getElementById("insurance_carrier").value = "Blue Cross Blue Shield";
$("#ref_service").val('16');
$("#ref_physician").val('2');
document.getElementById("date_ex1").value = "20 Jan 2017";
document.getElementById("date_ex2").value = "20 Jan 2017";
document.getElementById("date_ex3").value = "20 Jan 2017";
$("#pt_nutritionist").val('1');
document.getElementById("primary_diagnosis").value = "ICD-10";
document.getElementById("secondary_diagnosis").value = "ICD-10";
$("#problem").val('1');
$("#etiology").val('1');
$("#symptom").val('2');
$("#food_access").val('4');
}
});
});
我现在面临的问题是,当我从搜索框弹出窗口中选择项目时,字段不会自动填充。但是,当我选择项目并单击其他位置时,字段将自动填充。是因为Awesomplete小部件还是更改功能?我不明白为什么会这样。
我希望只要我从建议弹出列表中选择项目,那么只有字段应该自动填充。不需要额外的点击。
我该怎么做?有人可以帮我吗?
非常感谢。
编辑:我猜我的问题不是因为平等的标志。我的搜索显示结果= =和= =这也是。问题是需要额外点击才能显示结果。
答案 0 :(得分:0)
变化:
var pt_name = $('.awesomplete').val();
if(pt_name = "Samuel Mendoza"){
到
var pt_name = $(this).val();
if(pt_name == "Samuel Mendoza"){
==是比较运算符,而不是单个等号。 https://www.w3schools.com/js/js_comparisons.asp
同样$(this).val();
指的是更改的项目,这是有意义的。
然后我建议将document.getElementById("
的所有行更改为您在其他行上使用的更简单的jQuery语法。
IE改变:
document.getElementById("first_name").value = "Samuel";
要
$('#first_name').val() = "Samuel";
即使数据填充效率更高,也更容易阅读。