jsp jquery 实现删除操作(无需刷新)(原创,转载请注明)

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@page import="java.sql.*"%>

<!-- author:Evangelion

structions:关于jquery无刷新删除的思路:

一个jquery的行点击函数

-->
<!DOCTYPE html>

<html>
 <head>
  <title></title>
   <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css" />  
   <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css" />
   <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/demo/demo.css" />
   <link rel="stylesheet" type="text/css" href="CSS/editTable.css">
         <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script
         <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
         <script type="text/javascript" src="scripts/Jq/jquery-1.6.4.js"></script>
   <script type="text/javascript" src="scripts/js/WdatePicker.js"></script>
 
<!--       <script type="text/javascript" >
     
        $(document).ready(function() {
            $("#pager").pager({ pagenumber: 1, pagecount: 15, buttonClickCallback: PageClick });
        });

        PageClick = function(pageclickednumber) {
            $("#pager").pager({ pagenumber: pageclickednumber, pagecount: 15, buttonClickCallback: PageClick });
            $("#result").html("Clicked Page " + pageclickednumber);
        }
      
    </script>-->
  <script type="text/javascript">//行点击js方法 jquery实现, isSelected是一个标志,初始值为false然后在点击行之后为true,点击删除button时候调用的js的delWindow时候就

//可以判断是否选中一行,若没选中则使用if语句alert()然后return。这是一个思路,其实可以直接判断点击内容是否为空来判断是否选中行(选)。

  var isSeclected = false;
     $(function(){
     $("tbody>tr").click(function() {
    
  $(this)
   .addClass("selected")
    .siblings().removeClass("selected");
    
    isSeclected = true;
  });})
      </script>
      <script type="text/javascript">
      function addWindow()
      {
     
      window.open ("","Sample","fullscreen=no,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no, copyhistory=no,width=350,height=140,left=200,top=300");
       }
      function delWindow()
      {
      //alert($("tr.selected>td").eq(1).text());

//获得的是在table中选中的行

     if(!$("tr.selected").text())
     {
    
     alert("没有行被选中");
    
    
     return;
     }
       if(!confirm("是否将此信息删除?")) return;

//在选中行中获取单元格的值。
       s_boss_code=$("tr.selected>td").eq(1).text();
        $("tr.selected").remove();
        alert("删除成功!")
       // alert(s_boss_code);   //正确显示
//用来将获取到的单元格的值传送到jsp中的java代码中,可以在java中直接使用request.getParameter("px")来获取js中的值。(前后台交互,js负责的是前台传送到后台jsp中)
        window.location = 'index.jsp?px='+s_boss_code;
      
   
       
           
         
          
                  
      }
      
     
      </script>

 </head>
 <body>
  
   <div>
 
                               
                            
      
       套餐名称:
       <input type="text" name="plan_name" />
      
       BOSS编码:
       <input type="text" name="boss_code" />
      
       套餐类型:
       <select name="plan_type"></select>
      
       
     
       品牌:
       <select name="brand_id"></select>
      
       开始时间:
       <input name="plan_startdate" class="Wdate" type="text"
        onfocus="WdatePicker()" />
      
       结束时间:
       <input name="plan_enddate" class="Wdate" type="text"
        onfocus="WdatePicker()" />
      
      
       <input name="info" type="button" value="查询" />
       <input name="edit" type="button" value="修改"/>
       <input name="del"  type="button" value="删除" onclick="delWindow()"/>
       <input name="add" type="button" value="添加"  onclick="addWindow()">
 
     
   
   </div>
  
      <table border="1">

   <thead>

    <tr>
     <th width="200">
      套餐名称
     </th>
     <th width="200">
      BOSS编码
     </th>
     <th width="200">
      套餐类型
     </th>
     <th width="200">
      品牌
     </th>
     <th width="200">
      开始时间
     </th>
     <th width="200">
      结束时间
     </th>
    </tr>
   </thead>
  
   <%
      
          String s_boss_code=request.getParameter("px");
       int pageSize=10;
       int pageNow=1;
       int rowCount=0;
       int pageCount=0;
       String s_pageNow=request.getParameter("pageNow");
       if(s_pageNow!=null)
        {
           pageNow=Integer.parseInt(s_pageNow);
       }
    Connection conn = null;
    Statement stmt = null,stmt1=null,stmt2=null,stmt3=null;
    //ResultSet rs = null;
    ResultSet rsCount=null;
    ResultSet rsRownum=null;
    ResultSet reUpdate=null;
    try {//System.out.println(pageSize);
     Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();
     conn = DriverManager.getConnection(
       "jdbc:oracle:thin:@:orcl", "",
       "");
   
     //stmt = conn.createStatement();
     stmt1=conn.createStatement();
     stmt2=conn.createStatement();
     stmt3=conn.createStatement();
     System.out.println(s_boss_code);
     if(request.getParameter("px")!=null)
     {
         stmt3.executeUpdate("delete from pmp_plan t where boss_code='"+s_boss_code+"'");
     
     }
     //rs = stmt.executeQuery("select plan_name,boss_code,plan_type,brand_id,plan_startdate,plan_enddate from pmp_plan t ");
     rsCount=stmt1.executeQuery("select count(*) from pmp_plan t "); 
     rsRownum=stmt2.executeQuery("select plan_name,boss_code,plan_type,brand_id,plan_startdate,plan_enddate from(select rownum rown,plan_name,boss_code,plan_type,brand_id,plan_startdate,plan_enddate from pmp_plan t where rownum<="+pageNow*pageSize+")where rown>"+(pageNow-1)*pageSize);
     out.println("<tbody>");
     if(rsCount.next()){ rowCount=rsCount.getInt(1);}
     //System.out.println(rowCount);
     //System.out.println(rsRownum.next());
        while (rsRownum.next()) {
      out.println("<tr>");
      out.println("<td id='plan_name'>"
        + rsRownum.getString("plan_name") + "</td>");
      out.println("<td id='boss_code'>"
        + rsRownum.getString("boss_code") + "</td>");
      out.println("<td id='plan_type'>"
        + rsRownum.getString("plan_type") + "</td>");
      out.println("<td id='brand_id'>" + rsRownum.getString("brand_id")
        + "</td>");
      out.println("<td id='plan_startdate'>"
        + rsRownum.getString("plan_startdate") + "</td>");
      out.println("<td id='plan_enddate'>"
        + rsRownum.getString("plan_enddate") + "</td>");
      out.println("</tr>");

     }

     
    }
    catch (Exception ex) {
     out.println(ex.toString());
    } finally {
     //rs.close();
     rsCount.close();
     //rsRownum.close();
     //stmt.close();
     stmt1.close();
     stmt2.close();
     stmt3.close();
     conn.close();
    }
    out.println("</tbody>");
  
    //上一页
 
   %>
   </table>
   
   <%
   if(rowCount%pageSize==0)
   {
     pageCount=rowCount/pageSize;
     }
      else
   {
     pageCount=rowCount/pageSize+1;
     }
   if(pageNow!=1)
   {
    out.println("<a href=index.jsp?pageNow="+(pageNow-1)+">上一页</a>");
    }
      for(int i=1;i<=pageCount;i++)
      {
    out.println("<a href=index.jsp?pageNow="+i+">["+i+"]</a>");
    }
   if(pageNow!=pageCount){
                  out.println("<a href=index.jsp?pageNow="+(pageNow+1)+">下一页</a>");
                }
    %>
   

<!--   </table>
  <div id="toolbar">      
   <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">增加</a>
   <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">编辑</a>      
   <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">删除</a>    </div>
  </div>
   -->

 

 


 </body>
</html>

posted @ 2013-11-20 13:59  Evangelion  阅读(478)  评论(0编辑  收藏  举报