我使用AJAX智能搜索生成查询并在点击时填充表单字段。这一切都可以达到这一点。我有一个我无法弄清楚的错误。我需要在点击时重置URL参数,如果用户删除搜索字段中的所有内容,我还需要重置它们。这样,二次搜索就可以清除以前的任何数据,这就是我遇到的问题。基本上我需要刷新选项而不刷新整个页面。
/* JS File */
// Start Ready
$(document).ready(function() {
// Icon Click Focus
$('div.icon').click(function(){
$('input#search').focus();
});
// Live Search
// On Search Submit and Get Results
function search() {
var query_value = $('input#search').val();
$('b#search-string').html(query_value);
if(query_value !== ''){
$.ajax({
type: "POST",
url: "search.php",
data: { query: query_value },
cache: false,
success: function(html){
$("ul#results").html(html);
}
});
}return false;
}
$("input#search").live("keyup", function(e) {
// Set Timeout
clearTimeout($.data(this, 'timer'));
// Set Search String
var search_string = $(this).val();
// Do Search
if (search_string == '') {
$("ul#results").fadeOut();
$('h4#results-text').fadeOut();
//-----------------------------------------------------
// Clear all Form elements when search_string is blank
//-----------------------------------------------------
document.getElementById('firstName').value='';
document.getElementById('lastName').value='';
document.getElementById('email').value='';
document.getElementById('phone').value='';
document.getElementById('search').value='';
}else{
$("ul#results").fadeIn();
$('h4#results-text').fadeIn();
$(this).data('timer', setTimeout(search, 100));
};
});
});
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
function setclient() {
var email = getUrlVars()["setemail"];
var phone = getUrlVars()["setPhone"];
//----------------------------------------
// Strip HTML out of email string
//----------------------------------------
var div = document.createElement("div");
div.innerHTML = email;
var email = div.textContent || div.innerText || "";
//----------------------------------------
// Strip HTML out of company string
//----------------------------------------
var company = getUrlVars()["company"];
var div = document.createElement("div");
div.innerHTML = company;
var company = div.textContent || div.innerText || "";
//----------------------------------------
// Strip HTML out of First name string
//----------------------------------------
var firstname = getUrlVars()["setFname"];
var div = document.createElement("div");
div.innerHTML = firstname;
var firstname = div.textContent || div.innerText || "";
//----------------------------------------
// Strip HTML out of Last name string
//----------------------------------------
var lastname = getUrlVars()["setLname"];
var div = document.createElement("div");
div.innerHTML = lastname;
var lastname = div.textContent || div.innerText || "";
//----------------------------------------
// Convert company string to Title Case
//----------------------------------------
var str = company;
function eachWord(str){
return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}
var company = eachWord(str);
//----------------------------------------
// Set Form Fields on click
//----------------------------------------
document.getElementById('firstName').value=firstname;
document.getElementById('lastName').value=lastname;
document.getElementById('email').value=email;
document.getElementById('phone').value=phone;
document.getElementById('search').value=company;
//----------------------------------------
// Close search results onclick
//----------------------------------------
$("ul#results").fadeOut();
$('h4#results-text').fadeOut();
}