最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Refresh a div with ajax response - Stack Overflow

programmeradmin1浏览0评论

So i have a ments 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 ment.

I dont want anything plicated 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/addment.php",
        data: $targetForm.serialize(),
        dataType: "json",
        success: function(response){

    if (response.databaseSuccess)
       $ment.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 e.g

} 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.

So i have a ments 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 ment.

I dont want anything plicated 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/addment.php",
        data: $targetForm.serialize(),
        dataType: "json",
        success: function(response){

    if (response.databaseSuccess)
       $ment.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 e.g

} 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.

Share Improve this question edited Sep 13, 2013 at 20:12 craig asked Sep 13, 2013 at 19:50 craigcraig 1111 gold badge3 silver badges12 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 2

If you do

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

it will set the html within that div.

I think you are meaning to do this

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

checkout the jQuery.load documentation

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);
    });
}

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

$.ajax({
    type: "POST",
    url: "process/addment.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.mentText+'</div>');
            // if you want to append it to an already existing list of ments, you can use .append()
            $("#divid").append('<div class="success">'+response.mentText+'</div>');
        }
        else {
            $ckEditor.after('<div class="error">Something went wrong!</div>');
        }
    }
});

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

发布评论

评论列表(0)

  1. 暂无评论