CODEWITHSUNDEEP
javascriptphpajax
Gopal1216
Gopal1216

Reputation: 437

AJAX call to php not working

I'm working on AJAX programming in which I have a little problem. In the below code, I think my php script is not echoing back success. I'm trying to insert values into my database table. Accordingly, the values are getting inserted into the table. I have a span element on my page which by default shows nothing. But if the php script is echoing back success, it must show "AJAX worked". If my PHP script is not echoing back "success", it must show "AJAX didn't work". But it is showing "AJAX didn't work" though the values are getting inserted. If I didn't include the database code, then my script is echoing back success and the span element is showing "AJAX worked". But if I include database code, I think it is not echoing back success and the span elemnt is showing "AJAX didn't work". Below is my code:

<head>
<meta charset="UTF-8">
<title></title>
<script src="js/main.js"></script>
<script src="js/ajax.js"></script>
<script>
function insert(){
    var elem = _("myTextArea").value;
    var result = _("result");
    result.innerHTML += elem + "<br>";
    elem.value = "";
    var ajax = ajaxObj("POST", "dynamicdiv_parser.php");
    ajax.onreadystatechange = function() {
        if(ajaxReturn(ajax) == true) {
            if(ajax.responseText == "success"){
                _("status").innerHTML == "AJAX worked";
            }
            else{
                _("status").innerHTML == "AJAX didn't work";
            }
        }
    }
    ajax.send("post="+elem+"&type=a");
}
</script>
</head>
<body>
<form name="dynamicdivform" id="dynamicdivform" onsubmit="return false;">
<p id="result"></p>
<textarea name="myTextArea" id="myTextArea" cols="100" rows="14"></textarea><br>
<input type="button" id="postBtn" value="POST" onClick="insert()"> 
<span id="status"></span>
</form>
</body>

I have included two JavaScript files in my program which are main.js and ajax.js. Below is their code.

This is main.js:

function _(x){
    return document.getElementById(x);
}

This is ajax.js:

function ajaxObj( meth, url ) {
    var x = new XMLHttpRequest();
    x.open( meth, url, true );
    x.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    return x;
}
function ajaxReturn(x){
    if(x.readyState == 4 && x.status == 200){
        return true;    
    }
}

This is my PHP script which is echoing back success

  <?php
if(isset($_POST["post"])){
    include_once("php_includes/dbconsampledb.php");
    $data = $_POST['post'];
    $type = $_POST['type'];
    $sql = "INSERT INTO posts(data, type) 
            VALUES('$data','$type')";
    $query = mysqli_query($db_conx, $sql);
    echo "success";
}
?>

Before posting this question, I have tried the works but I didn't find any solution. This is very important to me. So please can anyone debug it and tell me what the problem is... Thanks in advance!!

Upvotes: -1

Views: 125

Answers (2)

Aret
Aret

Reputation: 475

My suggestion is to use a console.log() for debuging your ajax response.

if(ajaxReturn(ajax) == true) {
            console.log('Response: ', ajax.responseText);
            if(ajax.responseText == "success"){

Probably there is some errors with DB functionality.

Upvotes: 1

Chris
Chris

Reputation: 3445

_("status").innerHTML == "AJAX worked";

should be

_("status").innerHTML = "AJAX worked";

with one = only

Upvotes: 2

Related Questions