0

I'm using AJAX smart search that generates a query and populates form fields on click. It all works up to this point. I have a bug I can't figure out. I need the URL parameters to reset on click and I also need them to reset if the user deletes everything in the search field. That way secondary searches are clear of any previous data, that's the problem I'm having. Essentially I need a refresh option without refreshing the entire page.

/* 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();
                }
  • possible duplicate of [remove url parameters with javascript or jquery](http://stackoverflow.com/questions/4651990/remove-url-parameters-with-javascript-or-jquery) – isherwood Jun 13 '14 at 22:47
  • Thank you. I did see that post. I've tried it and recently tried a simple: return document.location.hash = "#"; However, previous submission results are still in the memory. What's happening is: I search for www.url.com/#foo=abc I click the link and foo=abc works Then I search for I search for www.url.com/#foo=123 I click the link and foo=abc happens again Then I search for I search for www.url.com/#foo=RRR I click the link and THEN foo=123 occurs The link results after the first search are always one result behind – user2330038 Jun 16 '14 at 19:40
  • Trouble shooting, I've determined that my code is getting the URL from the address field rather than the onclick event. That's my problem. now to fix that. – user2330038 Jun 16 '14 at 19:56
  • I fixed it myself. Instead of passing URL variables. I simply passed function variables onclick. Thank you for the help. – user2330038 Jun 16 '14 at 22:00

0 Answers0