удалить строку таблицы с помощью jQuery и Ajax

Question

Привет, друзей Я новичок в jquery и хочу изучить Ajax. Я разработал простой код, в котором я удаляю строки таблицы, а длина строки будет обновляться в одном div, вы можете проверить скрипку here или вы можете увидеть меня ниже код

SCRIPT

var len = $('table tr').length; 

$('.shopItems').text('items in your cart '+len); 

$('.del').click(function(){ 

    var len = $('table tr').length; 
    var len = len - 1; 
    $('.shopItems').text('items in your cart '+len); 
    //alert(len) 




if(len == 0) 
{ 
$('table').remove(); 
    $('.empty').show(); 
} 
    else{ 
    $(this).parent('tr').remove(); 
     len--; 
    } 


}) 

HTML

<div class="shopItems"></div> 

<div class="empty" >Your Cart is empty</div> 

<table width="100%"> 
    <tr> 
     <td>Image</td> 
     <td>Discription</td> 
     <td class="del">X</td>   
    </tr> 
     <tr> 
     <td>Image</td> 
     <td>Discription</td> 
     <td class="del">X</td>   
    </tr> 
     <tr> 
     <td>Image</td> 
     <td>Discription</td> 
     <td class="del">X</td>   
    </tr> 
</table> 

CSS

.empty{display:none;} 

Мой вопрос я могу сделать, это то же самое, используя с Ajax и как, пожалуйста, помогите мне.

Заранее спасибо ....

Answer 1

вы можете поместить эту функцию в вашем коде:

ajaxService = (function() { 
var ajaxGetJson = function (callback, isAsyncCall) { 

    //by default is an asyncrounous call 
    isAsync = (typeof isAsyncCall === "undefined") ? true : isAsyncCall; 

    $.ajax({ 
     url: "http://yourserviceorserversideapphere", 
     type: "GET", 
     data: request, 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     async: isAsync, 
     success: function (result, statusMsg, status) //3 parameters always come from ajax 
     { 
      callback(result, statusMsg, status, request); 
     }, 
     error: function (result, statusMsg, status) //3 parameters always come from ajax 
     { 
      ServiceFailed(result, statusMsg, status, getSvcUrl(service, method)); 
     } // When Service call fails 
    }); 
}; 

затем в вашей дель кнопки:

$('.del').click(function(){ 
    ajaxService.ajaxGetJson(successAjaxCall, true); 
} 

, и тогда вы будете иметь функцию, которую вы передаете в своем обратном вызове (successAjaxCall), чтобы сделать то, что делает кнопка .del в вашем коде.

function successAjaxCall(result, statusMsg, status) { 

    //you can use the result object to do anything you want here 

}