• 双向表-页面


    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>列表</title>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/css/index2.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script>
    </head>
    <body>
    <form action="long" method="post">
    <input type="button" value="新增" onclick="add()">
    订购日期:<input type="text" name="ctime1" value="${ctime1}">-<input type="text" name="ctime2" value="${ctime2}">
    请购单号:<input type="text" name="cqid" value="${cqid}"><br>
    联系人:<input type="text" name="cname" value="${cname}">
    电话:<input type="text" name="ctel" value="${ctel}">
    </form>
    <table>
    <tr>
    <th>订购编号</th>
    <th>订购日期</th>
    <th>请购单号</th>
    <th>联系人</th>
    <th>电话</th>
    <th>操作</th>
    </tr>
    <c:forEach items="${info.list }" var="m">
    <tr>
    <td>${m.id }</td>
    <td><fmt:formatDate value="${m.time}" pattern="yyyy-MM-dd"/></td>
    <td>${m.qid }</td>
    <td>${m.name }</td>
    <td>${m.tel }</td>
    <td>
    <input type="button" value="修改">
    <input type="button" value="删除">
    </td>
    </tr>
    </c:forEach>

    </table>
    <a href="long?pageNum=1">首页</a>
    <a href="long?pageNum=${info.pageNum-1 }">上一页</a>
    <a href="long?pageNum=${info.pageNum+1 }">下一页</a>
    <a href="long?pageNum=${info.pages }">尾页</a>
    </body>
    <script type="text/javascript">

    function add(){
    location = "/add";
    }

    </script>
    </html>

    ----------------------------------------------------

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>添加列表</title>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/css/index2.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js"></script>
    </head>
    <body>
    <form action="/addmingxi" method="post">
    <table>
    <tr>
    <td>订购编号</td>
    <td>
    <input type="text" name="id">
    </td>
    </tr>
    <tr>
    <td>订购时间</td>
    <td>
    <input type="date" name="time">
    </td>
    </tr>
    <tr>
    <td>请购单号</td>
    <td>
    <input type="text" name="qid">
    </td>
    </tr>
    <tr>
    <td>联系人</td>
    <td>
    <input type="text" name="name">
    </td>
    </tr>
    <tr>
    <td>电话</td>
    <td>
    <input type="text" name="tel">
    </td>
    </tr>
    </table>


    <table id="table" class="table-bordered">
    <tr>
    <td><input type='checkbox' class='ch'></td>
    <td>物料编号</td>
    <td>物料名称</td>
    <td>物料规格</td>
    <td>单位</td>
    <td>单价</td>
    <td>备注</td>
    <td>操作

    <input type="button" value="添加" onclick="add()">
    <input type="button" value="删除" onclick="del()">
    <input type="button" value="修改" onclick="update()">
    </td>

    </tr>

    </table>
    <input type="submit" value="提交">

    </form>
    </body>
    <script type="text/javascript">
    function add(){
    var str = "<tr>"+
    "<td><input type='checkbox' class='ch'></td>"+
    "<td><input type='text' name='id'> </td>"+
    "<td><input type='text' name='name'> </td>"+
    "<td><input type='text' name='guige'> </td>"+
    "<td><input type='text' name='danwei'> </td>"+
    "<td><input type='text' name='price'> </td>"+
    "<td><input type='text' name='beizhu'> </td>"+

    "</tr>"

    $("#table").append(str);
    }

    function del(){
    var s = $(".ch:checked").parent();
    var ss = $(s).parent();
    ss.html("")
    }

    function update(){
    if($(".ch:checked").val()!=1){
    var s = $(".ch:checked").parent();
    var ss = $(s).parent();
    ss.html("")
    var str =
    "<td><input type='checkbox' class='ch' value='1'></td>"+
    "<td><input type='text' name='id'> </td>"+
    "<td><input type='text' name='name'> </td>"+
    "<td><input type='text' name='guige'> </td>"+
    "<td><input type='text' name='danwei'> </td>"+
    "<td><input type='text' name='price'> </td>"+
    "<td><input type='text' name='beizhu'> </td>"
    $(ss).append(str);
    }else{
    $("input[name=id]").attr("readonly","false");
    $("input[name=name]").attr("readonly","false");
    $("input[name=guige]").attr("readonly","false");
    $("input[name=danwei]").attr("readonly","false");
    $("input[name=price]").attr("readonly","false");
    $("input[name=beizhu]").attr("readonly","false");
    $(".ch:checked").val("")

    }



    }

    </script>
    </html>

  • 相关阅读:
    NTP服务安装
    Teambition 的使用
    搭建svn服务器和测试
    通过NTP协议进行时间同步
    转利用OpenSSL库对Socket传输进行安全加密(RSA+AES)
    转源码编译安装MySQL5.6.12详细过程
    CentOS 6.4安装ffmpeg2.4.2 支持h.265
    转:CentOS 6.4 64-bit编译安装ffmpeg
    Work 2013 博客园挂博客
    FLASH和EEPROM的最大区别
  • 原文地址:https://www.cnblogs.com/liuzhaolong/p/12971381.html
Copyright © 2020-2023  润新知