在ajax / json调用成功时更新div

I have a create new album form on my page along side a delete album form. On the sucess of the album create I would like to automatically update the checkbox list that is in the delete album form with the newly created album details. The delete album form gets it's checkbox delete list by using php within the page. Deleting an album uses an ajax call triggered by the album delete button, on success return of the php delete script the checkbox and parent div is removed. At this time for the delete form list to get updated the page has to be reloaded. Is there a way to update the delete list without reloading the page. All the posts I have looked at talk about append html with json message which isnt going to work, and I havent yet seen a solution that enables refreshing a div like refreshing a page although ultimately if there doesnt seem to be another way then thats what I will have to trigger in my album create success return.

我在我的页面上创建了一个新的专辑表格,旁边是删除专辑表格。在专辑创建成功后,我想使用新创建的专辑详细信息自动更新删除专辑表单中的复选框列表。删除相册表单通过在页面中使用php获取它的复选框删除列表。删除相册使用由相册删除按钮触发的ajax调用,在成功返回php删除脚本时,复选框和父div将被删除。此时,要删除表单列表以进行更新,必须重新加载页面。有没有办法更新删除列表而无需重新加载页面。我看过的所有帖子都谈到用json消息附加html,这不会起作用,我还没有看到一个解决方案,可以刷新一个像刷新页面的div,虽然最终如果似乎没有其他方式那么那就是我将不得不在我的专辑中触发创建成功回报。

jquery for add new album

jquery用于添加新专辑

<script type="text/javascript">

$(document).ready(function() {

    $("#add_new_catagory").click(function() {

    if($("#catagory_name").val()=="" || $("#albumDescription").val()=="")   {

    $("#addAlbumError").html("Please enter Album Name and Album Description");

        return false;   

    }else{


    $("#addAlbumError").html('<img src="image/ajax-loader.gif" width="16" height="16" alt=""/>');
    var albumName=$("#catagory_name").val();
    var albumDescription=$("#albumDescription").val();


$.post("includes/add_albumn_catagory.inc.php",{album_name:albumName,album_description:albumDescription},function(json)   {
    if(json.result === "success") {

        $("#addAlbumError").html(json.message);

        $('#add_category').get(0).reset();



    }else{
        $("#addAlbumError").html(json.message);
    }
});
    }   



});//submit click
});//doc ready
</script>

html form for delete album that I woud like to refresh

我愿意刷新的删除相册的html表单

<div class="list_album">

  <div id="deleteAlbum_title">Delete Album</div>

<form action="includes/delete_album.inc.php" id="album_delete">

      <p>

            <?php 
            while($row = mysqli_fetch_array($result3)){ ?>

          <div id="album_echo_list">

            <input name="albumid" type="checkbox" id="addImage" value="<?php echo $row['albumid'];?>">


            <?php echo $row['album_name'];?> <?php echo '';?><?php echo $row['albumDescription'];?> <?php echo '<br/>';?>
  </div> 
            <?php } ?>
            <br>
</p>


        </form>


<input name="submit" type="button" id="delete_album_but" style="display:none" title="Delete Album" value="Delete Album" form="album_delete"/>

    <div id="deleteAlbumNotice" style="display: block">Choose an Album to Delete<br>By Deleting an Album all pictures and subdirectories in the Album will be Deleted Also!</div>

  <div id="deleteAlbum"></div>

</div>
</div>

I hope I managed to explain this properly and I have posted the relevent code

我希望我能够正确解释这一点,并且我发布了相关代码

1 个解决方案

#1

You're expecting the response JSON to be parsed, but you never told $.post that it's being returned as JSON. Add another argument:

您期望解析响应JSON,但您从未告诉$ .post它将作为JSON返回。添加另一个参数:

$.post("includes/add_albumn_catagory.inc.php",{album_name:albumName,album_description:albumDescription},function(json)   {
    if(json.result === "success") {

        $("#addAlbumError").html(json.message);

        $('#add_category').get(0).reset();



    }else{
        $("#addAlbumError").html(json.message);
    }
}, "json"); // <<--- response dataType