用Ajax响应刷新div

Question

So i have a comments box with a form (textbox and submit). This gets validated and then sent to the php page via ajax.

If all okay, the response is set and the page continues.

I want however the div to refresh itself so that you can see the new comment.

I dont want anything complicated like appending etc just simply to reload the div (data is pulled from database).

I have used this in the past but it doesnt work:

 $('#divid').load('page.php #divid'),

any idea how i can convert this:

        if (check == true) {
        $.ajax({
        type: "POST",
        url: "process/addcomment.php",
        data: $targetForm.serialize(),
        dataType: "json",
        success: function(response){

    if (response.databaseSuccess)
       $comment.after('<div class="error">Comment Added</div>');
    else
       $ckEditor.after('<div class="error">Something went wrong!</div>');

}
        });
    }
    return false;
});

});

To refresh the div once the success gets responded?

if i try to add another $return to my php eg

} catch (Exception $e) {
$return['databaseException'] = $e->getMessage();
}

$return['databaseSuccess'] = $dbSuccess;
$return['responseHtml'] = 'Post Updated';

echo json_encode($return);

the javascript doesnt work and i just get the php page load with the returns printed..

Thanks.

Answer 1

If you do

$("#divid").html( "Comment Added" )

it will set the html within that div.

Answer 2

I think you are meaning to do this

$('#divid').load('page.php');

checkout the jQuery .load documentation

Answer 3

First you need some PHP code on the sever side that generates the HTML for the div. Then use this JavaScript

if (check == true) {
  $.ajax({
    type: ...,
    url: ...,
    data: ...,
    dataType: "html"
  })
    .done(function(responseHtml) {
      $("#yourDiv").html(responseHtml);
    });
}

Answer 4

I assume you are processing the comment on the server after it has been submitted (validation/sanitation/etc.). Therefor I would return the processed comment as part of the response and then insert it into the HTML:

$.ajax({
    type: "POST",
    url: "process/addcomment.php",
    data: $targetForm.serialize(),
    dataType: "json",
    success: function(response){
        if (response.databaseSuccess) {
            // if you have a designated empty div already, you can use .html()
            $("#divid").html('<div class="success">'+response.commentText+'</div>');
            // if you want to append it to an already existing list of comments, you can use .append()
            $("#divid").append('<div class="success">'+response.commentText+'</div>');
        }
        else {
            $ckEditor.after('<div class="error">Something went wrong!</div>');
        }
    }
});

Of course, this will require you to add response.commentText to your returned JSON object.