AJAX / JS Function Only Runs Once

[KPheasey]

I have the following code which should update the total items in a categories list every time that a search filter is changed. However, the function will only run once.

function getXMLHTTP() { //fuction to return the xml http object
                var xmlhttp=false;
                try{
                    xmlhttp=new XMLHttpRequest();
                }
                catch(e)	{
                    try{
                        xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
                    }
                    catch(e){
                        try{
                            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                        }
                        catch(e1){
                            xmlhttp=false;
                        }
                    }
                }

                return xmlhttp;
            }

function getCategoryTotals(temp) {
                var state = document.getElementById('state').value;
                var area = document.getElementById('area').value;
                var type = document.getElementById('type').value;
                var category = document.getElementById('category').value;

                var strURL="<?= $path ?>common/locationSelector/findCategoryTotals.php?state="+state+"&area="+area+"&type="+type+"&category="+category;
                var req = getXMLHTTP();

                if (req) {

                    req.onreadystatechange = function() {
                        if (req.readyState == 4) {
                            // only if "OK"
                            if (req.status == 200) {
                                document.getElementById('categorydiv').innerHTML=req.responseText;
                            } else {
                                document.getElementById('categorydiv').innerHTML=req.responseText;
                                alert("There was a problem while using XMLHTTP:\n" + req.responseText);
                            }
                        }
                    }
                    req.open("GET", strURL, true);
                    req.send(null);
                }
            }

Here is where it is being called and used:
http://ground360.org/coupons/index.php

The PHP file* it calls upon contains the following:

$type = secure($_GET['type']);
$state = secure($_GET['state']);
$area = secure($_GET['area']);
$selectedCategory = secure($_GET['category']);

$categories = array('From Airport', 'To Airport', 'Hourly', 'One-way');

echo "<select name=\"category\">
        <option value=\"\">Select Category</option>
        <optgroup label=\"Most Popular:\">";

foreach ($categories as $category) {
    $countQuery = "SELECT id FROM gd_offers WHERE category = '$category' AND expirationDate >= NOW() AND status = 'Approved'";

    if ($state != '') {
        $countQuery .= " AND memberID IN (
                SELECT id
                FROM members
                WHERE company IN (
                    SELECT tcid FROM tcomps
                        WHERE astate IN (
                            SELECT sab
                            FROM state_ft
                            WHERE stateid = '$state') ";

        if ($area != '') {
            $countQuery .= "         AND  tcid IN (
                                SELECT companyid FROM area_company WHERE areaid = '$area')";
        }

        $countQuery .= "))";
    }

    $countResult = mysql_query($countQuery);

    echo "<option value=\"$category\"";

    if ($selectedCategory == $category) {
        echo " selected";
    }

    echo ">$category (" . mysql_num_rows($countResult) . ")</option>";
}

echo "</optgroup>
      <optgroup label=\"Special Occasions:\">";

$query = "SELECT * FROM gd_categories WHERE category != 'To Airport' AND category != 'From Airport'  AND category != 'Hourly'  AND category != 'One-way' ORDER BY category ASC";
$result = mysql_query($query);

while ($row = mysql_fetch_array($result)) {
    $countQuery = "SELECT id FROM gd_offers WHERE category = '" . $row['category'] . "'  AND expirationDate >= NOW() AND status = 'Approved'";

    if ($state != '') {
        $countQuery .= " AND memberID IN (
                SELECT id
                FROM members
                WHERE company IN (
                    SELECT tcid FROM tcomps
                        WHERE astate IN (
                            SELECT sab
                            FROM state_ft
                            WHERE stateid = '$state') ";

        if ($area != '') {
            $countQuery .= "         AND  tcid IN (
                                SELECT companyid FROM area_company WHERE areaid = '$area')";
        }

        $countQuery .= "))";
    }

    $countResult = mysql_query($countQuery);

    echo "<option value=\"" . $row['category'] . "\"";

    if ($selectedCategory == $row['category']) {
        echo " selected";
    }

    echo ">" . $row['category'] . " (" . mysql_num_rows($countResult) . ")</option>";
}

echo "</optgroup>
      </select>";

*A database connection is present, I just left the connect/disconnect out.

You realize you've posted code now that allows people to completely screw with your site? You allow SQL injections which allows anyone who knows SQL to delete all your data and drop all your tables and databases. Please use stored procedures for your own good.

As for the JavaScript only running once. Are there any JavaScript errors on the page when it gets executed?

[Luckychap]

There was an error while checking on Chrome as on FireFox its messe up, The error was at index.php:139

Uncaught TypeError: Cannot read property 'value' of null

Resolve this.

[KPheasey]

You realize you've posted code now that allows people to completely screw with your site? You allow SQL injections which allows anyone who knows SQL to delete all your data and drop all your tables and databases. Please use stored procedures for your own good.

As for the JavaScript only running once. Are there any JavaScript errors on the page when it gets executed?

Oops, lol. I will remove the PHP code, since it isn't actually relevant to the problem. However, I'm pretty confident in how I secure all of my input against injection.

As for JS errors, I get one error when the function is called a second time:
document.getElementById("category") is null

Could this be because, the category select box is being redrawn completely by the PHP script?

[KPheasey]

Problem solved. The PHP script was redrawing the select box, but it did not have an ID associated to it. This was causing a NULL value to be passed to the function.

However, I'm pretty confident in how I secure all of my input against injection.

I'm sorry but you are kidding yourself. All I'd need to do is pass something in the querystring to findCategoryTotals.php?state=SomeSQLInjection and you no longer have a database. Honestly I'm just trying to help you. This looks like a professional site which mean that you should protect yourself from this stuff. All you'd need to do is switch over to using stored procedures instead of inline SQL.