I am trying to populate a variable with an XML response from an ajax call on page load so that on keyup I can filter through that list without making repeated get requests (think very rudimentary autocomplete). The trouble that I am having seems to be potentially related to variable scoping but I am fairly new to js/jQuery so I am not quite certain.
The following code doesn't do anything on key up and adding alerts to it tells me that it is executing leadResults() on keyup and that the variable is returning an XML response object but it appears to be empty. The strange bit is that if I move the leadResults() call into the getResults() function the UL is populated with the results correctly.
Im beating my head against the wall on this one, please help!
var resultsXml;
$(document).ready( function() {
var leadLookupCaml =
"<Query> \
<Where> \
<Eq> \
<FieldRef Name=\"Lead_x0020_Status\"/> \
<Value Type=\"Text\">Active</Value> \
</Eq> \
</Where> \
</Query>"
$().SPServices({
operation: "GetListItems",
webURL: "http://sharepoint/departments/sales",
listName: "Leads",
CAMLQuery: leadLookupCaml,
CAMLRowLimit: 0,
completefunc: getResults
});
})
$("#lead_search").keyup( function(e) {
leadResults();
})
function getResults(xData, status) {
resultsXml = xData;
}
function leadResults() {
xData = resultsXml;
$("#lead_results li").remove();
$(xData.responseXML).find("z\\:row").each(function() {
var selectHtml =
"<li>"
+ "<a href=\"http://sharepoint/departments/sales/Lists/Lead%20Groups/DispForm.aspx?ID=" + $(this).attr("ows_ID") + ">" + $(this).attr("ows_Title")+" : " + $(this).attr("ows_Phone") + "</a>\
</li>";
$("#lead_results").append(selectHtml);
});
}
