Question

What the heck is up with this code?

    $(".submit").click(function(){
    alert("clicked");
    var name = $(".name").val();
    var email = $(".email").val();
    var comment = $(".comment").val();
    var articleId = $(".articleId").val(); 
    var dataString = 'name='+ name + '&email=' + email + '&comment=' + comment+ '&articleId=' + articleId;
    if(name=='' || comment==''){
        alert('Please Give Valid Details');
    }
    else{
        alert('so far so good');
        $.ajax({
            type: "POST",
            url: "../_includes/process.php",
            data: dataString,
            cache: false,
            success: function(){
                alert("succes");
                $(".updating").fadeIn(400);
            }
        });
    }
});

Everything works until $.ajax finds process.php and instead of reading and executing the code it actually goes to that page in the browser. I tried using return false after the ajax call but then the code in process.php never happens.

here is process.php

    <?php 
    // code to establish connection first

    if($_POST){
    $name=$_POST['name'];
    $name=mysql_real_escape_string($name);

    $email=$_POST['email'];
    $email=mysql_real_escape_string($email);

    $comment=$_POST['comment'];
    $comment=mysql_real_escape_string($comment);

    $articleId=$_POST['articleId']; 
    $articleId=mysql_real_escape_string($articleId);

    if(!empty($email)){
            $lowercase = strtolower($email);
    }

    $result = mysql_query("INSERT INTO comments(name,email,comment,articleId) VALUES ('$name','$email','$comment','$articleId')");

    if($result){
            echo "success";
    } else {
            echo "there were erros" . mysql_error();
    }
    exit;

    ?>

Any help would be appreciated.

Answer 1

You have to prevent the default action of your submit button:

$(".submit").click(function(e) {
    e.preventDefault();
    alert("clicked");
    ...
});