使用JQUERY AJAX（Spring MVC）從控制器中刪除

Question

有人可以幫我解決這個問題嗎？我需要使用這個存儲庫實現ajax，sweetalert.js：http://t4t5.github.io/sweetalert/

一切都很順利，使用onclick =「」並調用我的函數。如果有人能告訴我應該如何使用這個功能來淘汰員工，我會非常感激。

這是我的控制器方法::

@RequestMapping(value = "/eliminarEmpleado", method = RequestMethod.GET) 
public ModelAndView eliminarEmpleado(HttpServletRequest request) { 
    int empId = Integer.parseInt(request.getParameter("id")); 
    empleadoService.eliminarEmpleado(empId); 
    return new ModelAndView("redirect:/"); 
} 

這是我的jsp，員工的名單和刪除按鈕是（我需要更換，我經受考驗，這肯定行之有效的HREF但不使用，我需要骨的方式：jQuery的）:::

<table id="central" class="table table-condensed" align="center"> 

    <thead > 
     <tr> 
      <th >ID</th> 
      <th>NOMBRE</th> 
      <th >AP. PATERNO</th> 
      <th>AP. MATERNO</th> 
      <th>EMAIL</th> 
      <th>TELÉFONO</th> 
      <th>FECHA DE NACIMIENTO</th> 
      <th>SALARIO</th> 
      <th>REGIÓN</th> 
      <th>PAÍS</th> 
      <th>CALLE</th> 
      <th>CÓDIGO POSTAL</th> 
      <th>CIUDAD</th> 
      <th>PROVINCIA</th> 
      <th>DEPARTAMENTO</th> 
      <th>ACCIONES</th> 
     </tr> 
    </thead> 
    <tbody> 


     <c:forEach items="${lista}" var="r"> 
      <tr> 
       <td id="idEmpleado" align="center">${r.idEmpleado}</td> 
       <td align="center">${r.nombre}</td> 
       <td align="center">${r.apPaterno}</td> 
       <td align="center">${r.apMaterno}</td> 
       <td align="center">${r.email}</td> 
       <td align="center">${r.telefono}</td> 
       <td align="center">${r.fechaNac}</td> 
       <td align="center">${r.salario}</td> 
       <td align="center">${r.nombreRegion}</td> 
       <td align="center">${r.nombrePais}</td> 
       <td align="center">${r.nombreCalle}</td> 
       <td align="center">${r.codigoPostal}</td> 
       <td align="center">${r.ciudad}</td> 
       <td align="center">${r.provincia}</td> 
       <td align="center">${r.nombreDepartamento}</td> 

       <td><a data-original-title="Ver" href="editContact.htm?id=${empleado.id}" data-toggle="tooltip" data-placement="top" title=""><span class="glyphicon glyphicon-eye-open"></span></a> <a data-original-title="Eliminar" href="eliminarEmpleado.htm?id=${r.idEmpleado}" data-toggle="tooltip" data-placement="top" title=""><span class="glyphicon glyphicon-trash"></span></a> </td> 
       </tr> 
     </c:forEach> 

    </tbody> 
</table> 

，這是我的jQuery代碼，他們可以幫助我？我需要確切地知道如何使用它，我繼續努力小時，我還沒有結果，我希望:(

<script> 


    function deleteEmploy(idEmpleado) { 

     swal({ 
      title: "Are you sure?", 
      text: "You will not be able to recover this imaginary file!", 
      type: "warning", 
      showCancelButton: true, 
      confirmButtonColor: "#DD6B55", 
      confirmButtonText: "Yes, delete it!", 
      cancelButtonText: "No, cancel plx!", 
      closeOnConfirm: false, 
      closeOnCancel: false 
      }, 
      function(isConfirm){ 
       if (isConfirm) { 

        swal("Deleted!", "Your imaginary file has been deleted.", "success"); 
        } else {  swal("Cancelled", "Your imaginary file is safe :)", "error"); 
     } }); 
    event.preventDefault 


} 
    </script> 

Answer 1

你缺少ajax函數調用，將調用eliminarEmpleado控制器方法在服務器上。方也沒有在你的代碼的任何地方被稱爲deleteEmploy（）

試試這個：

HTML：添加id來點擊它應該調用deleteEmploy（）

<td><a data-original-title="Eliminar" data-toggle="tooltip" data-placement="top" title="" id="deleteEmp" ><span class="glyphicon glyphicon-trash"></span></a> </td> 

012當錨標記

Javascript：註冊deleteEmploy（）作爲<a id="deleteEmp">鏈接的onclick事件處理程序，並致電ajax()。

<script> 

    $("#deleteEmp").on("click", deleteEmploy); //when #deleteEmp link is clicked, deleteEmploy() will be called 

    function deleteEmploy() { 

     swal({ 
      title: "Are you sure?", 
      text: "You will not be able to recover this emplyoyee!", 
      type: "warning", 
      showCancelButton: true, 
      confirmButtonColor: "#DD6B55", 
      confirmButtonText: "Yes, delete it!", 
      cancelButtonText: "No, cancel plx!", 
      closeOnConfirm: false, 
      closeOnCancel: false 
      }, 
      function(isConfirm){ 
       if (isConfirm) { 
        var data = {}; 
        data["idEmpleado"] = $("#idEmpleado").html(); 
        $.ajax({ 
         type: "GET", 
         contentType: "application/json", 
         url: "${home}/eliminarEmpleado", 
         data: JSON.stringify(data), 
         dataType: "json", 
         success: function(){ 
          swal("Deleted!", "The employee has been deleted.", "success"); 
         }, 
         error: function(){ 
          swal("Error", "Could not be deleted! :)", "error"); 
         } 

        }); 



       } else {  swal("Cancelled", "Employee is safe :)", "error"); 
     } }); 
    event.preventDefault 


} 
</script>