在AJAX调用之后使用JQuery更新div

时间:2016-08-14 21:11:15

标签: javascript jquery html ajax

我正在使用AJAX调用删除和正在运行的项目,我遇到的麻烦是更新div中的数据表以反映数据库中的项目删除。

2 个答案:

答案 0 :(得分:0)

所以这里简短的回答:

 if(itemdel=="deleted")
 {
     console.log("get request to datatable");
     //add the absolute url here so with http://xyz.xy/includes/datatable.php
     $.get('includes/datatable.php', function( data ) {
         console.log("data received, data");
         $('#dataTable').html(data);
     });
 }

答案 1 :(得分:0)

这里的“长期”尝试理解:)

var delID = document.getElementById('delID').value;

$('#so-delete').on('click', deleteData); // execute the deleteData function on click // without ()!!! when you put () it will be executed @init

function deleteData() {
    apiCall("includes/deletesoitem.php", "POST", loadData, delID); // makes the request --> loadData function executed after ajax call is successfully finished
}

function loadData(itemdel) {
    if (itemdel == "deleted") {
        alert("SUCCESS: Item Deleted Successfully!");
    //  the "anonymous "callBack" function will be executed after ajax request is finished
        apiCall("includes/datatable.php", "GET", function (msg) {
            $('#dataTable').html(msg);
        });
    }
}

/**
 *
 * @param url Request for the URL
 * @param ajaxMethod Request Method (POST/GET/ETC)
 * @param callBack Callback method this method will be executed after     ajax request is successful
 * @param data Request body data
 */
function apiCall(url, ajaxMethod, callBack, data) {
    var requestData = (data != "undefined") ? data : {}; // set request data to data if exists

    var request = $.ajax({
        url: url,
        method: ajaxMethod,
        data: requestData,
        dataType: "text"
    });

    request.done(function (msg) {
        //execute the callback function
        callBack(msg);
    });

    request.fail(function (jqXHR, textStatus) {
        alert("Request failed: " + textStatus);
    });
}