java--jstl小結(MVC框架2)

MVC1:http://blog.csdn.net/xanlv/article/details/52822352
Servlet+JSP+JavaBean的編程模型

功能講解

1.點添加出現添加聯繫人界面(聯繫人信息都沒有填則無法添加)

2.添加聯繫人，演示checkbox組件

checkbox組件的中間狀態

3.刪除聯繫人

刪除之後

沒有選擇聯繫人刪除

代碼展示:

index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <title>聯繫人管理系統</title>
    <link rel="stylesheet" type="text/css" href='<c:url value="/css/table.css"/>'/>
    <script type="text/javascript" src='<c:url value="/js/table.js"/>'>
    </script>
    <script type="text/javascript">
        var path="<c:url value='/'/>";//把項目根目錄存儲到js變量path
    </script>
  </head>

  <body>
    <div>
        <button onclick="add()">增加聯繫人</button>
        <button onclick="del()">刪除聯繫人</button>
    </div>
    <table id="table">
        <tr><th><input id="parentChk" type="checkbox" onclick="parentChk(this)"/>選擇</th>
        <th>姓名</th><th>年齡</th><th>電話</th>
        <!-- 
        <th style="display: none;">id</th>
         -->
        <!-- 設類樣式"iid",隱藏 -->
        <th class="iid">id</th>
        </tr>
    </table>
    <!-- 專用於實現ajax提交ids信息的表單和隱藏幀 -->
    <form action="<c:url value="/"/>/del" name="f" target="df" method="post">
        <input type="hidden" name="ids"/><br/>
    </form>
    <iframe name="df" style="display: none;"></iframe>
  </body>
</html>

css/table.css–設置表table

body {
    text-align: center;
}
table {
    border: 2px solid red;
    border-collapse: collapse;
    clear: left; 
    width: 500px;
}
th,td{
    border: 2px solid red;
}
div {
    float: left;
    margin-bottom: 4px;
}
.iid{
    display: none;
}

js/table.js

function add(){
    var url=path+"/jsps/input.jsp";//目錄穿透
    //當模態對話框關閉時的返回值--window.returnValue=obj;
    var resObj=window.showModalDialog(url,{},"dialogHeight:200px;dialogWidth:300px");
//  alert(resObj);//這裏不能彈出
    if(resObj){//如果resObj的值爲false,0,undefined,null--則resObj的值均爲false
        addToTable(resObj);
    }
}
function addToTable(resObj){
//  alert(resObj);//這裏不能彈出
    var oTable=document.getElementById("table");
    var oTr=oTable.insertRow();
    var cell_1=oTr.insertCell();
    cell_1.innerHTML="<input type='checkbox' name='chk' οnclick='subChk();'/>";
    var cell_2=oTr.insertCell();
    cell_2.innerHTML=resObj.name;
    var cell_3=oTr.insertCell();
    cell_3.innerHTML=resObj.age;
    var cell_4=oTr.insertCell();
    cell_4.innerHTML=resObj.tel;
    var cell_5=oTr.insertCell();
    //添加<id>列並設類樣式"iid"
    cell_5.className="iid";
    cell_5.innerHTML=resObj.id;

}
function parentChk(obj){
    //  obj.checked=!obj.checked;//這一句不需要,但點擊組件時,組件會自己執行這一句
//  if (obj.checked==false&&obj.indeterminate==false) {
//      obj.indeterminate=true;
//      return;
//  }
    var chks = document.getElementsByName("chk");
    for ( var i = 0; i < chks.length; i++) {
        chks[i].checked = obj.checked;
    }
}
function subChk(){
    //var tb = document.getElementById("tb");
    var chks = document.getElementsByName("chk");
    var count=0;
    for ( var i = 0; i < chks.length; i++) {
        if(chks[i].checked){
            count++;
        }
    }
    var pChk=document.getElementById("parentChk");
    if(count ==0){
        pChk.indeterminate=false;
        pChk.checked=false;
    }else if(count ==chks.length){
        pChk.indeterminate=false;
        pChk.checked=true;
    }else{
        pChk.checked=false;
        pChk.indeterminate=true;
    }
}

function relDel(boo){
    if(!boo){
        alert("刪除失敗...");
        return;
    }
    var chks = document.getElementsByName("chk");
    for ( var i = chks.length-1; i >=0; i--) {
        if(chks[i].checked){
            var oTr=chks[i].parentNode.parentNode;
            oTr.parentNode.removeChild(oTr);
        }
    }
    subChk();
}
function del(){
    var chks = document.getElementsByName("chk");
    var ids=null;
    for ( var i = 0; i < chks.length; i++) {
        if(chks[i].checked){
            var oTd=chks[i].parentNode;
            var oTr=oTd.parentNode;
            var id=oTr.cells[4].innerHTML;
            if(ids==""){
                ids+=id;
            }else{
                ids+="#@"+id;//把將要刪除的聯繫人的id用“#@”
            }

        }
    }
    if(ids==null){
        alert("請選擇需要刪除的聯繫人...");
        return ;
    }
    //利用ajax向後臺發送要刪除的那些表格行中的id ---ids
    document.getElementsByName("ids")[0].value=ids;
//  alert(ids);
    document.forms["f"].submit();
}

servlet

package cn.hncu.servlet;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import cn.hncu.domain.User;
import cn.hncu.service.IUserService;
import cn.hncu.service.UserServiceImpl;

public class SaveServlet extends HttpServlet {

    //注入
    IUserService us=new UserServiceImpl();
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        doPost(request, response);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        //收集參數
        request.setCharacterEncoding("utf-8");
        String name=request.getParameter("name");
        String strAge=request.getParameter("age");
        String tel=request.getParameter("tel");
        Integer age=Integer.parseInt(strAge);
        //組織參數
        User user=new User();
        user.setName(name);
        user.setAge(age);
        user.setTel(tel);
        //調用service層
        user=us.save(user);
        if(user!=null){
            request.setAttribute("user", user);
        }
        request.getRequestDispatcher("/jsps/saveBack.jsp").forward(request, response);
    }

}

package cn.hncu.servlet;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import cn.hncu.service.IUserService;
import cn.hncu.service.UserServiceImpl;

public class DelServlet extends HttpServlet {

    //注入
    IUserService us=new UserServiceImpl();
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        doPost(request, response);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        //收集參數(本例省略數據有效性防護)
        request.setCharacterEncoding("utf-8");
        String ids=request.getParameter("ids");
        //組織參數
        //調用service層
        boolean boo=us.del(ids);
        //導向結果頁面
        if(boo){
            request.setAttribute("succ", true);
//          request.setAttribute("ids", ids);
        }
        request.getRequestDispatcher("/jsps/delBack.jsp").forward(request, response);
    }

}

domain/User.java

package cn.hncu.domain;

public class User {

    private String name,tel,id;
    private Integer age;
    public User() {
    }

    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getTel() {
        return tel;
    }
    public void setTel(String tel) {
        this.tel = tel;
    }
    public Integer getAge() {
        return age;
    }
    public void setAge(Integer age) {
        this.age = age;
    }
    @Override
    public String toString() {
        return "User [name=" + name + ", tel=" + tel + ", age=" + age + "]";
    }

}

service

package cn.hncu.service;

import cn.hncu.domain.User;

public interface IUserService {

    User save(User user);

    boolean del(String ids);
}

package cn.hncu.service;

import cn.hncu.dao.UserDAO;
import cn.hncu.dao.UserDAOImpl;
import cn.hncu.domain.User;


public class UserServiceImpl implements IUserService{

    //注入
    UserDAO dao=new UserDAOImpl();
    @Override
    public User save(User user) {
        return dao.save(user);
    }
    @Override
    public boolean del(String ids) {
        System.out.println("del:"+ids);
        String id[]=ids.split("#@");

        boolean boo=true;
        for(String i:id){
            System.out.println(i);
            boo=dao.del(i);
            if(boo==false){
                break;
            }
        }
        return boo;
    }


}

dao

package cn.hncu.dao;

import cn.hncu.domain.User;

public interface UserDAO {

    User save(User user);

    boolean del(String i);
}

package cn.hncu.dao;

import java.util.UUID;

import cn.hncu.domain.User;

public class UserDAOImpl implements UserDAO {

    @Override
    public User save(User user) {
        String id=UUID.randomUUID().toString().replace("-", "");
        user.setId(id);
        //模擬--假裝訪問了數據庫
        System.out.println("存儲到數據庫:"+user);
        return user;

    }

    @Override
    public boolean del(String i) {
        //模擬--假裝訪問了數據庫
        System.out.println("刪除聯繫人成功:"+i);
        return true;
    }

}

jsps

saveBack.jsp(從後臺回來,攜帶後臺信息,解析再封裝傳給主頁面)

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <title>該頁面顯示在隱藏幀內</title>
    <!-- 該頁面是ajax的返回頁面，顯示在隱藏幀中  -->
    <!-- 技術學習: 如何從web容器中把後臺返回的數據讀取並傳遞給js  -->
    <!--
        <input type="text" id="id" value="<c:out value='${requestScope.user.id}' />" /> 
     -->
    <script type="text/javascript">
        //var id = document.getElementById("id").value;
        var obj=new Object();
        obj.id="<c:out value='${requestScope.user.id}'/>";
        obj.name="<c:out value='${requestScope.user.name}'/>";
        obj.age="<c:out value='${requestScope.user.age}'/>";
        obj.tel="<c:out value='${requestScope.user.tel}'/>";
        parent.relSave(obj);
    </script>
  </head>

  <body>

  </body>
</html>

input.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <title>添加聯繫人頁面</title>
    <script type="text/javascript">
        function save(){
            //正式項目這裏需要數據校驗
            document.forms["form"].submit();
        }
        function relSave(obj){
            window.returnValue=obj;//窗口關閉後的返回值--obj(savaBack.jsp攜帶後臺轉發的信息)
            //window.returnValue傳值--在主頁面可以接收到
            window.close();
        }
    </script>
  </head>

  <body>
    <h2>請輸入聯繫人信息</h2>
    <!-- target="df"提交的表單的結果會在iframe中顯示 -->
    <form action="<c:url value="/"/>/save" name="form" target="df" method="post">
        姓名:<input type="text" name="name"/><br/>
        年齡:<input type="text" name="age"/><br/>
        電話:<input type="text" name="tel"/><br/>
    </form>
    <button onclick="save();">添加</button>&nbsp;&nbsp;&nbsp;&nbsp;
    <button onclick="window.close();">取消</button>
    <iframe name="df" style="display: none;"></iframe><!-- 隱藏幀 -->
  </body>
</html>

delBack.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <title>該頁面顯示在隱藏幀內</title>
    <script type="text/javascript">
        var boo="<c:out value='${requestScope.succ}'/>";
        parent.relDel(boo);
    </script>
  </head>

  <body>

  </body>
</html>

java--jstl小結(MVC框架2)

java--JSTL(2)

java--數據庫連接池4(多例)

java--JSTL(1)

java--DBUtils數據庫操作工具包

java--jstl小結(MVC框架2)

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結