【发布时间】:2016-02-10 14:08:26
【问题描述】:
我希望使用以前的注册人数据填充注册表。 目前,我使用 Ajax、Jquery 和 PHP(来自 MySQL 数据库)创建了一个搜索字段,您可以在其中开始输入姓氏,然后出现一个显示姓名和生日的按钮列表。
我想要它,以便您单击正确的名称并填充表单字段。
我正在寻找有关我是否应该让按钮(单击时)对 PHP 搜索文件进行新的 Ajax 调用、传递该注册人的 ID 的建议,或者是否应该简单地存储我需要的所有数据第一个 Ajax 调用,然后在单击按钮时将该信息传递给我的表单字段。
以一种方式或另一种方式这样做有优势吗?
如果搜索中出现一千个名字,存储所有数据需要一段时间,但如果只是少数返回的名字,那会不会很重要?
此外,我可以清楚地知道如何使第二次 Ajax 搜索工作,但我不清楚如果我在第一次调用时存储信息的最佳方式。 (存储在一个数组中?可以直接解析 JSON 数据吗?如果是这样,我无法想象“如果它会存在”,而一个按钮正在等待被点击。
这是我当前生成按钮的代码(大部分来自互联网):
<script type="text/javascript">//
$("#searchbox").keyup(function(e){
var q = "data=" + $("#searchbox").val();
var sLength = q.length;
if (sLength > 7){
$.ajax({
dataType: "json",
url: "autoLookup.php?" + q,
success:
function(data) {
$("#searchResult").empty();
$("#searchButtonHeader").empty();
$("#searchButtonHeader").append("Results for <b>" + q + "</b>");
$.each(data, function(i,item){
$("#searchResult").append("<button type='button' class='btn btn-primary regName' name='" + item.uId + "'>" + item.firstname + " " + item.lastname + " (" + item.city + ", " + item.state + " " + item.dobf + ") </button>");
//storeVals
qArray =
});
}
})
}//if
else {
$("#searchResult").empty();
}
});
感谢您的意见!!!
J
添加此信息:
您好 Jakub,感谢您的帮助...这是我的“autolookup.php”文件:
$key = $_GET['data'];
$return_arr = array();
//search older roster for runner data
$query =("SELECT * FROM roster2015done WHERE lastname LIKE '{$key}%' ORDER BY lastname, firstname, dob");
//echo $query . "<br><br>";
if ($key != "") {
$result = SQL($query);
while($row = mysql_fetch_assoc($result))
{
$array['uId'] = $row['Id'];
$array['firstname'] = $row['firstname'];
$array['lastname'] = $row['lastname'];
$array['city'] = $row['city'] ;
$array['state'] = $row['state'];
$array['dob'] = $row['dob'];
$array['dobf'] = date("m-d-Y", strtotime($row['dob'])); //dob formatted for diaplay
$array['addr1'] = $row['addr1'];
$array['addr2'] = $row['addr2'];
$array['email'] = $row['email'] ;
$array['phone'] = $row['phone'];
array_push($return_arr, $array);
}
echo json_encode($return_arr);
}else{
$return_arr = "";
echo json_encode($return_arr); //send empty array if search box is emptied. (belt and suspenders: js is doing this already)
}
如您所见,我让 PHP 从数据库中提取我想要的数据并将其添加到数组中,然后进行 JSON 编码。因此,当我的“按钮”在我的 html 页面上重新创建时,虽然我只显示名字、姓氏、城市和 dob,但实际上我带来了我最终想要填充表单的其他字段(我已经添加了这个 - 然后提出了我的问题,这是否是一个好主意)。
我不确定的是,假设我返回 10 个结果。我正在显示 10 个按钮(每次迭代“项目”时,它都会创建按钮),但是如果我希望能够单击正确的按钮并让该人的信息填充表单,那么数据是否仍然可用被“搜索”和使用?如果是这样,它在哪里? JSON 数组(或对象 - 不确定它的正确术语)是否仍然“可用”以进行搜索/解析?或者我是否也应该将信息存储在一个新的多维数组或我可以访问的东西中? (我意识到如果我已经有一个可搜索的 JSON 对象,这似乎有点多余 - 但我有吗?)
谢谢,J
这里是我最终用来在按钮单击时填充表单的代码:
<script type="text/javascript">
变量数据;
$("#searchbox").keyup(function(e){
var q = "data=" + $("#searchbox").val();
var sLength = q.length;
if (sLength > 7){
$.ajax({
dataType: "json",
url: "autoLookup.php?" + q,
success:
function(data) {
var results = data; **//ADDED THIS BECUASE USING data var below didn't work.**
$("#searchResult").empty();
$("#searchButtonHeader").empty();
$("#searchButtonHeader").append("Results for <b>" + q + "</b>");
$.each(data, function(i,item){
$("#searchResult").append("<button type='button' class='btn btn-primary regName' name='" + item.uId + "'>" + item.firstname + " " + item.lastname + " (" + item.city + ", " + item.state + " " + item.dobf + ") </button>");
});
**//HERE IS WHAT I ADDED TO POPULATE THE FORM**
$("#searchResult").on('click', ".regName", function(data){
//alert($(this).attr('name'));
var userId = $(this).attr('name');
$.each(results, function(i,item){
//alert(item.uId + " : " + userId);
if (item.uId == userId){
//alert ("Name is: " + item.firstname + item.lastname);
$("#lastname").val(item.lastname);
$("#firstname").val(item.firstname);
$("#addr1").val(item.addr1);
$("#addr2").val(item.addr2);
$("#city").val(item.city);
$("#state").val(item.state);
$("#zip").val(item.zip);
$("#email").val(item.email);
$("#phone").val(item.phone);
$("#dob").val(item.dob);
$("#gender").val(item.gender);
$("#size").val(item.size);
//remove buttons.
$("#searchResult").empty();
}
});
});
}
})
}//if
else {
$("#searchResult").empty();
}
});
【问题讨论】:
标签: jquery ajax forms autocomplete