更新列表不顯示在JSP頁面，甚至刪除查詢的成功執行後

Question

我的jsp頁面代碼是在這裏：

<form id="target" > 
     <table id="table"> 
      <tr id="firstrow"><th>Product Name</th><th>Quantity</th><th>Price/unit</th><th>Vendor's Name</th><th>actions</th></tr> 

       <c:forEach var="current" items="${sessionScope.productname}" > 
       <tr id="select_one"> 
        <input id="productId" type="hidden" name="productId" value="<c:out value="${current.productId}" />"/> 
        <td><input id="productName" class="box" type="" name="productName" value="<c:out value="${current.productName}" />" readonly></td> 
        <td><input id="quantity" class="box" type="" name="quantity" value="<c:out value="${current.quantity}"/>" readonly></td> 
        <td><input id="price" class="box" type="" name="price" value="<c:out value="${current.price}"/>" readonly></td> 
        <td><input id="vname" class="box" type="" name="vname" value="<c:out value="${current.vname}"/>" readonly></td> 
        <td> 
        <input class="Edit" type="button" name="action" value="Edit"> 
        <input class="delete"type="button" name="action" value="Delete"> 
        </td> 
      </tr> 
      </c:forEach> 

     </table> 
    </form> 

的，我已經爲「刪除」按鈕是寫（這也是工作正常的jQuery ）

$(document).ready(function() { 

    $(".delete").click(function() 
      { 
      $("#table").remove(); 
       var productId=$(this).closest('tr').find("#productId").val(); 

       var param = {productId:productId}; 

       $.ajax({ 
        url: './deleteproduct', 
        data: param, 
        type: 'post', 
        success: function(result) { 
        location.reload(); 
        } 
       }); 
      }); 

}); 

而且我deleteproduct（）用於功能碼是

public static boolean deleteProduct(int productId) { 
    boolean status=false; 
    String driverClass="com.mysql.jdbc.Driver"; 
    String dbUrl="jdbc:mysql://localhost:3306/pmsdb?&relaxAutoCommit=true"; 
    String dbUser="root"; 
    String dbPswd="root"; 


    PreparedStatement pstmt=null; 
    Connection con=null; 

    try{ 

     Class.forName(driverClass); 
     con=DriverManager.getConnection(dbUrl,dbUser,dbPswd); 

     pstmt=con.prepareStatement("DELETE FROM `pms_prd_details` WHERE `producid`=?"); 
     pstmt.setInt(1, productId); 
     pstmt.executeUpdate(); 
     con.commit(); 
     System.out.println("Record is deleted!"); 

    }catch (SQLException e) { 
     // TODO Auto-generated catch block 
     e.printStackTrace(); 
    } catch (ClassNotFoundException e) { 
     // TODO Auto-generated catch block 

     e.printStackTrace(); 
    } catch (NumberFormatException e) { 
     // TODO Auto-generated catch block 
     e.printStackTrace(); 
    } 
    finally{ 
     if (con != null) { 
      try { 
       con.close(); 
      } catch (SQLException e) { 
       e.printStackTrace(); 
      } 
     } 
     if (pstmt != null) { 
      try { 
       pstmt.close(); 
      } catch (SQLException e) { 
       e.printStackTrace(); 
      } 
     } 

    } 
    return status; 
} 

而且這裏也是我的servlet的doPost（）方法

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
    // TODO Auto-generated method stub 
    doGet(request, response); 
    int productId=Integer.parseInt(request.getParameter("productId")); 
    System.out.println(productId); 
    DeleteProductFromList dpd=new DeleteProductFromList(); 
    if (dpd.deleteProduct(productId)){ 
      System.out.println("true"); 
      ShowProduclist lst= new ShowProduclist(); 
      request.getSession().setAttribute("productname", lst.showProductlist()); 
      RequestDispatcher rd=request.getRequestDispatcher("ProductList.jsp");  
      rd.include(request,response); 

    } 
} 

我eaxact的問題是，當我致電

request.getSession().setAttribute("productname", lst.showProductlist()); 

創造新紀錄或更新新的記錄，並嘗試在它的正常工作在同一個JSP頁面顯示。但在刪除時，我做了同樣的事情，但儘管它在我的jsp頁面中成功刪除了數據庫中的記錄，但它顯示了已刪除的記錄。發生了什麼？請幫助我，謝謝。

Answer 1

您可能需要了解Ajax的工作原理。當你使用Ajax在jQuery中調用你的刪除時，沒有頁面重新加載。你的客戶端仍然有相同的HTML，但他只是在後臺發送刪除請求。

所以整個通信是在Javascript內部。您的服務器可以與一些狀態（例如200 OK）迴應，你可以在JavaScript的一些動作從服務器在您成功函數此響應（使用JavaScript/jQuery的水木清華這樣從HTML刪除對象：

$("#item10").remove() 

您可以嘗試使用一些工具如Firebug（插件的Firefox）來跟蹤你的HTML/Ajax請求弄清楚發生了什麼

更新：

$(document).ready(function() { 

    $(".delete").click(function() 
      { 

       var productId=$(this).closest('tr').find("#productId").val(); 

       var param = {productId:productId}; 

       $.ajax({ 
        url: './deleteproduct', 
        data: param, 
        type: 'post', 
        success: function(result) { 
        //find row to delete and use remove(); 
        } 
       }); 
      }); 

});