Querying all Categories in Autocomplete

Let me preface this is by saying that the website I am going to be talking about is a Wordpress site. Its purpose is to serve as a directory for a variety of business types `(doctors, lawyers, realtors, etc)`.

Now with that out of the way, here's the issue:

A month ago, a colleague of mine and I posted on his account a question asking on StackOverflow if someone could help us implement a live autosuggestion feature on one of our theme's existing `search bar`. Here is the link for that: https://stackoverflow.com/questions/49040586/implementing-autocomplete-on-a-wordpress-site-php-jquery

The person that helped us was extremely generous and essentially built a solid amount of Javascript in order to create the feature and it was splendid, but...there was one problem.

The problem was that we only could query based off of a letter. What I mean by that is, is we couldn't query every single doctor category unless it had the letter "a" for instance, or "abc".

What we wanted is that when you pick "Doctor" in the first `search box`, that all Doctor categories would show up in the 3rd `search box`, and never had to even worry about querying based off of a letter or anything for that matter. The program should know that once we have `"Doctor"` selected in the first `search box`, that all subcategories of Doctor should show up.

There are 4 components to the query. It starts from the custom Javsacript code on the website where we find the third 'search box', and then call the autosearch function to search. Here it is:

document.getElementById("search_keywords").onkeyup= function() {

var firstCat = document.getElementById("search_categories");

var valCat = firstCat.options[firstCat.selectedIndex].value;

listingsLiveSearch(this.value, valCat);

}

document.getElementById("search_keywords").onclick= function() {

var firstCat = document.getElementById("search_categories");

var valCat = firstCat.options[firstCat.selectedIndex].value;

listingsLiveSearch("a", valCat);

}

The second part is the custom Javascript code, located here where you'll find the 'listingsLiveSearch()' function: https://pastebin.com/NUFAqtFy

The third part is the php files calling the XML files, where each category (doctors, lawyers, etc.) have their own php file and XML file. Here is the php file called of when you click on doctor:

//This PHP file is reponsible for accessing its associated xml document and

creating divs for each item if they match the user's entered text.

$xmlDoc = new DOMDocument();

$xmlDoc->load("links_Doctor.xml");

$x=$xmlDoc->getElementsByTagName('link');

//get the q parameter from URL

$q=$_GET["q"];

//lookup all links from the xml file if length of q>0

if (strlen($q)>0) {

$hint="";

for($i=0; $i<($x->length); $i++) {

$y=$x->item($i)->getElementsByTagName('title');

$z=$x->item($i)->getElementsByTagName('url');

if ($y->item(0)->nodeType==1) {

//find a link matching the search text

if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q)) {

if ($hint=="") {

$hint="" .

$y->item(0)->childNodes->item(0)->nodeValue . "";

} else {

$hint=$hint . " " .

$y->item(0)->childNodes->item(0)->nodeValue . "";

}

}

}

}

}

// Set output to "no suggestion" if no hint was found

// or to the correct values

if (($hint=="")) {

$response="No Suggestions Found";

} else {

$response=$hint;

}

//output the response

echo $response;

?>

Here is an example of the XML for the doctor category which contains a list of all the subcategories:

Acupuncture

https://www.visitblue.com/listing-category/acupuncture

Bariatric Surgery

https://www.visitblue.com/listing-category/bariatric-surgery

Cardiology

https://www.visitblue.com/listing-category/cardiology

Chiropractic Physical Therapy

https://www.visitblue.com/listing-category/chiropractic-physical-therapy

Cosmetic Specialist

https://www.visitblue.com/listing-category/cosmetic-specialist

Dentistry

https://www.visitblue.com/listing-category/dentistry

Family Medicine

https://www.visitblue.com/listing-category/family-medicine

Fertility

visitblue.com/listing-category/fertility

General Surgery

https://www.visitblue.com/listing-category/general-surgery

Gynecology

https://www.visitblue.com/listing-category/gynecology

Internal Medicine

https://www.visitblue.com/listing-category/internal-medicine

Lasik

https://www.visitblue.com/listing-category/lasik

Medical Imaging

https://www.visitblue.com/listing-category/medical-imaging

Neurology

https://www.visitblue.com/listing-category/neurology

Neurosurgery

https://www.visitblue.com/listing-category/neurosurgery

Optometry

https://www.visitblue.com/listing-category/optometry

Orthopaedic Surgery

https://www.visitblue.com/listing-category/orthopedic-surgery

Orthopaedics

https://www.visitblue.com/listing-category/orthopedics

Pain Management

https://www.visitblue.com/listing-category/pain-management

Pediatric Dentistry

https://www.visitblue.com/listing-category/pediatric-dentistry

Pediatrics

https://www.visitblue.com/listing-category/pediatrics

Pharmacy

https://www.visitblue.com/listing-category/pharmacy

Plastic Surgery

https://www.visitblue.com/listing-category/plastic-surgery

Podiatry

https://www.visitblue.com/listing-category/podiatry

Psychotherapy

https://www.visitblue.com/listing-category/psychotherapy

Sleep Apnea

https://www.visitblue.com/listing-category/sleep-apnea

Spine Care

https://www.visitblue.com/listing-category/spine-care

Spine Surgery

https://www.visitblue.com/listing-category/spine-surgery

Urgent Care

https://www.visitblue.com/listing-category/urgent-care

Urology

https://www.visitblue.com/listing-category/urology

If you're wondering why there's a link in the XML files, originally we had it where when you click on the search suggestion it would take you automatically to the page but then we changed it so the links are arbitrary.