如果AJAX调用和放大器，我怎么能删除视图中的行？ db删除成功了吗？

Question

我有一个表，每行都有一个删除按钮。实际上我每次都删除该行而不检查ajax调用是否成功。如何实现这一点，以便只有在ajax调用正常时才会删除该行。

这是我每行的clickhandler

$("body").on('click', ".ui-icon-trash" ,function(){

    var $closestTr = $(this).closest('tr');  // This will give the closest tr
                            // If the class element is the child of tr          
    deleteRowFromDB(oTable, closestTr);
    $closestTr.remove() ;  // Will delete that
 });

这是我的ajax电话

function deleteRowFromDB(oTable, sendallproperty){

        var deleteEntryRoute = #{jsRoute @Application.deleteConfigurationEntry() /}
        console.log("route is: " + deleteEntryRoute.url)
        $.ajax({
           url: deleteEntryRoute.url({id: sendallproperty}),
           type: deleteEntryRoute.method,
           data: 'id=' + sendallproperty
        });

Answer 1

在Ajax请求的成功回调函数中调用它

$.ajax({
         url: deleteEntryRoute.url({id: sendallproperty}),
         type: deleteEntryRoute.method,
         data: 'id=' + sendallproperty.
         success : function() {
             // Your code here
        }
     });

修改

$("body").on('click', ".ui-icon-trash" ,function(){

    var $closestTr = $(this).closest('tr');     
    deleteRowFromDB(oTable, $closestTr);
});

function deleteRowFromDB(oTable, sendallproperty){

   var deleteEntryRoute = #{jsRoute @Application.deleteConfigurationEntry() /}
   console.log("route is: " + deleteEntryRoute.url)
   $.ajax({
           url: deleteEntryRoute.url({id: sendallproperty}),
           type: deleteEntryRoute.method,
           data: 'id=' + sendallproperty,
           success : function() {
             sendallProperty.remove();
           }
   });
};

{id: sendallproperty}也是一个jQuery对象..

如果你想传递id ...你需要这样做

{id: sendallproperty.attr('id')}

Answer 2

$("body").on('click', ".ui-icon-trash" ,function(){

    var $closestTr = $(this).closest('tr');  // This will give the closest tr
                        // If the class element is the child of tr          
    if(true === deleteRowFromDB(oTable, closestTr)){
        //if true returned from the success in the ajax function, then we remove
        $closestTr.remove() ;  // Will delete that
    }

 });



function deleteRowFromDB(oTable, sendallproperty){

    var deleteEntryRoute = #{jsRoute @Application.deleteConfigurationEntry() /}
    console.log("route is: " + deleteEntryRoute.url)
    $.ajax({
       url: deleteEntryRoute.url({id: sendallproperty}),
       type: deleteEntryRoute.method,
       data: 'id=' + sendallproperty,
       success:function(data){
           return true;
       },
       error:function(){
           return false;
       }
    });
}