CODEWITHSUNDEEP
phpajax
maxelcat
maxelcat

Reputation: 1333

using ajax to change div - not working

I have a js function:

function updateDescriptor(subj){
    "use strict";
     var xhttp;
     xhttp = new XMLHttpRequest();
     xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            document.getElementById("txtHint").innerHTML = xhttp.responseText;
        }    
    };
    xhttp.open("GET", "ajaxy/fred.php?q"+subj, true);
    xhttp.send();
}

fred.php is very simple (it will ultimately be a db query)

$returntext="<h1>hello from my first ajax thing</h1>";
echo '$returntext;

In the HTML is:

 <h1>Edit Subject Descriptors</h1>
 <div id="txtHint"><p>text hint</p></div>
<form name="subject-descriptors" action="assessment-subject-descriptors.php" method="post" class="complex-grey">
        <div class="column">
            <div class="formelement">
            <select name="subjects" class="lineInput updatetextbox" onchange="updateDescriptor(this.value)">
:
</form>

I know that updateDescriptor is being called - I had an alert. However, the txtHint content is not changing so something is wrong.

Any ideas plesse?

I have been following a w3schools tutorial

Upvotes: 1

Views: 25

Answers (1)

Rajdeep Paul
Rajdeep Paul

Reputation: 16963

There are two things you need to change.

First this:

xhttp.open("GET", "ajaxy/fred.php?q"+subj, true);
                                   ^ you forgot an equal sign here

So it should be,

xhttp.open("GET", "ajaxy/fred.php?q="+subj, true);

And second, remove ' from echo '$returntext;, it should be echo $returntext;

Upvotes: 2

Related Questions