How to get the result from submit.php with Javascript?

Question

Hi there i have these HTML forms:

<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="./comments.js"></script>
</head>
<div id="addCommentContainer">
<form class="add-comment-form" id="addCommentForm3" method="post" action="">
<input type="hidden" value="3" name="comentonpost" id="comentonpost" />
<textarea class="commentinput" name="body" id="body" cols="20" rows="5"></textarea>
<input type="button" class="add-comment-submit" value="Submit" />
</form>
</div>
<div id="addCommentContainer">
<form class="add-comment-form" id="addCommentForm3" method="post" action="">
<input type="hidden" value="3" name="comentonpost" id="comentonpost" />
<textarea class="commentinput" name="body" id="body" cols="20" rows="5"></textarea>
<input type="button" class="add-comment-submit" value="Submit" />
</form>
</div>

Here is my JS:

     $(document).ready(function () {
// $(".add-comment-submit") selects all elements with the class "add-comment-submit", so the "submit" buttons
// .on will handle event binding for the click event on any of those buttons
$(".add-comment-submit").on("click", function (e) {
    e.preventDefault();
    // 'this' is the element that fired the event, so the submit button
    var submit = $(this);

    // check if the submit button has the "working" class added. this will tell us that someone already clicked it
    // and we shouldn't continue
    if (submit.hasClass("working")) return false;

    // add "working" class to the submit button to prevent double click
    submit.addClass("working");
    submit.val("Working...");

    /* Sending the form fileds to submit.php: */
    // do the post, and on callback (simulated with setTimeout) set everythign back
    $.post('submit.php',$(this).serialize(),function(msg){

    // simulate post 
    setTimeout(function () {   
        submit.removeClass("working");
        submit.val("Submit");

        //$(msg.html).hide().insertBefore(submit.parent()).slideDown();

        // simulate getting results back from server
        $("<div>Here are some results or something</div>").hide().insertBefore(submit.parent($(".addCommentContainer"))).slideDown();

    }, 1000);
    });
});
});

With this JS after pressing the SUBMIT button on every form appears before it the message "Here are some results or something".

Here is my submit.php:

<?PHP 
$message = "Hello world";

echo $message;
?>

Answer 1

正如文档中明确指出的那样，回调中的第一个参数是服务器的响应。

Answer 2

$.post('submit.php',$(this).serialize(),function(msg){

    // simulate post 
    setTimeout(function () {   
        submit.removeClass("working");
        submit.val("Submit");

        //$(msg.html).hide().insertBefore(submit.parent()).slideDown();

        // simulate getting results back from server
        $("<div>" + msg +"</div>").hide().insertBefore(submit.parent($(".addCommentContainer"))).slideDown();

    }, 1000);
    });

How to get the result from submit.php with Javascript?

Question

2 answers

solution1
0 2013-06-03 13:57:51

solution2
0 2013-06-03 15:07:16

How to get the result from submit.php with Javascript?

Question

2 answers

solution1 0 2013-06-03 13:57:51

solution2 0 2013-06-03 15:07:16

solution1
0 2013-06-03 13:57:51

solution2
0 2013-06-03 15:07:16