Search code examples
javascriptphpajaxswitch-statementonkeyup

PHP Ajax onkeyup doesn't work on my Switch case website

I have a website where I use php case and include as website. So depending on the ?page="" result I get it includes a new website.

Example: www.test.come/?page=test.

The example I use to test the PHP and Ajax onkeyup function is this one:

Test.php

<script>
function showHint(str) {
    if (str.length == 0) { 
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "gethint.php?q=" + str, true);
        xmlhttp.send();
    }
}
</script>
</head>
<body>

<p><b>Start typing a name in the input field below:</b></p>
<form> 
First name: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>

gethint.php

<?php
// Array with names
$a[] = "Anna";
$a[] = "Brittany";
$a[] = "Cinderella";
$a[] = "Fiona";
$a[] = "Gunda";

// get the q parameter from URL
$q = $_REQUEST["q"];

$hint = "";

// lookup all hints from array if $q is different from "" 
if ($q !== "") {
    $q = strtolower($q);
    $len=strlen($q);
    foreach($a as $name) {
        if (stristr($q, substr($name, 0, $len))) {
            if ($hint === "") {
                $hint = $name;
            } else {
                $hint .= ", $name";
            }
        }
    }
}

// Output "no suggestion" if no hint was found or output correct values 
echo $hint === "" ? "no suggestion" : $hint;
?>

So if my www.test.com/?page=test it will include the Test.php on my website.

Everything on Test.php is uploaded on the website and looks great but when I type in the letter a for example in the box then the name Anna is supposed to pop up but it doesn't.

but if I type the page www.test.com/include/Test.php where the Test.php file exist it works perfectly.

Here is the code that I use to switch between different pages:

<?php
if(isset($_GET["page"])){
    $page = $_GET["page"];
} else {
$page = "News";
}

I think this could be the biggest reason why this doesn't work, but then I need an explanation for why and if there is something I can do to make it work.

I can give you a full example on all my code, but that will become a WALL of TEXT, so I thought saving you all time but shorting it up. If you need the full code to figure the issue out then I will help you with it.

Thank you very much for taking time to read this and trying to solve it.

Best regards Simon

Solution

  • You need to change the AJAX call to use an absolute path for gethint.php. Otherwise it will look for it in the same folder as the page that's making the AJAX call. 

    xmlhttp.open("GET", "/include/gethint.php?q=" + str, true);