简体   繁体   中英

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!!

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

should be

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

with one = only

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM