• 添加页面+正则+三级联动


      1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
      2 <%
      3     String path = request.getContextPath();
      4     String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
      5             + path + "/";
      6 %>
      7 
      8 <!doctype html>
      9 <html lang="en">
     10 <head>
     11 <meta charset="UTF-8">
     12 <meta name="viewport"
     13     content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
     14 <meta http-equiv="X-UA-Compatible" content="ie=edge">
     15 <title>新增学员</title>
     16 <link rel="stylesheet"
     17     href="./vendor/simple-line-icons/css/simple-line-icons.css">
     18 <link rel="stylesheet"
     19     href="./vendor/font-awesome/css/fontawesome-all.min.css">
     20 <link rel="stylesheet" href="./css/styles.css">
     21 <script src="./vendor/jquery/jquery.min.js"></script>
     22 <script src="./vendor/popper.js/popper.min.js"></script>
     23 <script src="./vendor/bootstrap/js/bootstrap.min.js"></script>
     24 <script src="./vendor/chart.js/chart.min.js"></script>
     25 <script src="./js/carbon.js"></script>
     26 <script src="./js/demo.js"></script>
     27 <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
     28 <script type="text/javascript">
     29     function tijiao() {
     30         var flag = true;
     31 
     32         
     33         var p1 = /^[u4e00-u9fa5]{2,}$/;
     34         if (p1.test($("#name").val())) {
     35             $("#names").empty();
     36         } else {
     37             $("#names").html("姓名至少两个中文");
     38         }
     39         
     40         /* var p2 = /^d+$/;
     41         if(p2.test($("#pidx").val())){
     42             $("#xuehao").empty();
     43         }else{
     44             $("#xuehao").html("学号必须是位数字");
     45         } */
     46         
     47         if($("#age").val()>17 && $("#age").val()<30){
     48             $("#ages").html("");
     49         }else{
     50             $("#ages").html("年龄18~30之间");
     51         }
     52         
     53         if($("#team").val()!=""){
     54             $("#s7").html("");
     55         }else{
     56             $("#s7").html("小组必选")
     57         }
     58         
     59         if($("#add").val()!=""){
     60             $("#s8").html("");
     61         }else{
     62             $("#s8").html("地址必填")
     63         }
     64 
     65         if (!$(":radio:checked").length > 0) {
     66             $("#sex").html("<font color='red'>性别必选</font>");
     67         } else {
     68             $("#sex").html("");
     69         }
     70         
     71         $(".tishi").each(function(){
     72             if($(this).html()!=""){
     73                 flag = false;
     74             }
     75         });
     76 
     77         if (flag) {
     78             var num = $("#myform").serialize();
     79             $.ajax({
     80                 url : "StudentAddServlet",
     81                 type : "post",
     82                 data : num, //参数
     83                 dataType : "text",
     84                 success : function(data) {
     85                     if (data > 0) {
     86                         alert("添加成功");
     87                         location.href = "studentShow.jsp";
     88                     } else {
     89                         alert("添加失败");
     90                     }
     91                 }
     92             })
     93         }
     94 
     95 
     96     }
     97     //查id
     98     $(function() {
     99         $.ajax({
    100             url : "SelectCityServlet",
    101             type : "post",
    102             data : {
    103                 cid : 1
    104             },
    105             dataType : "json",
    106             success : function(data) {
    107                 $.each(data, function(i, val) {
    108                     $("#sheng").append("<option value='" + this.id + "'>" + this.cityname + "</option>")
    109                 })
    110             }
    111         })
    112     });
    113 
    114 
    115     //2级联动
    116     function ChooseCity(id) {
    117         if (id != "") {
    118             $.ajax({
    119                 url : "SelectCityServlet",
    120                 data : {
    121                     cid : id
    122                 },
    123                 dataType : "json",
    124                 success : function(data) {
    125                     //清空之前的城市信息
    126                     $("#opt1").siblings().remove();
    127                     //添加城市信息
    128                     $.each(data, function(i, val) {
    129                         $("#shi").append("<option value='" + this.id + "'>" + this.cityname + "</option>")
    130                     })
    131                 }
    132             })
    133         } else {
    134             //清理之前的城市信息
    135             $("#opt1").siblings().remove();
    136             //清理之前的区 县信息
    137             $("#opt2").siblings().remove();
    138         }
    139     }
    140     //3ji
    141     function ChooseQu(id) {
    142         if (id != "") {
    143             $.ajax({
    144                 url : "SelectCityServlet",
    145                 data : {
    146                     cid : id
    147                 },
    148                 dataType : "json",
    149                 success : function(data) {
    150                     //先清理之前的区县信息
    151                     $("#opt2").siblings().remove();
    152                     //添加区 信息
    153                     //添加城市信息
    154                     $.each(data, function(i, val) {
    155                         $("#xian").append("<option value='" + this.id + "'>" + this.cityname + "</option>")
    156                     })
    157                 }
    158             })
    159         } else {
    160             //清理之前的区、县信息
    161             $("#opt2").siblings().remove();
    162         }
    163     }
    164 
    165     function getAdd() {
    166         var pro = $("#sheng option:selected").text();
    167         var city = $("#shi option:selected").text();
    168         var qu = $("#xian option:selected").text();
    169         $("#add").val(pro + "" + city + "" + qu);
    170     }
    171     
    172 </script>
    173 <style type="text/css">
    174     span{
    175         color: red;
    176     }
    177 </style>
    178 </head>
    179 <body class="sidebar-fixed header-fixed">
    180     <div class="page-wrapper">
    181         <div class="page-header">
    182             <nav class="navbar page-header">
    183                 <a href="#"
    184                     class="btn btn-link sidebar-mobile-toggle d-md-none mr-auto"> <i
    185                     class="fa fa-bars"></i>
    186                 </a> <a class="navbar-brand" href="#"> <img src="./imgs/logo.png"
    187                     alt="logo">
    188                 </a> <a href="#" class="btn btn-link sidebar-toggle d-md-down-none">
    189                     <i class="fa fa-bars"></i>
    190                 </a>
    191 
    192                 <ul class="navbar-nav ml-auto">
    193                     <li class="nav-item d-md-down-none"><a href="#"> <i
    194                             class="fa fa-bell"></i> <span
    195                             class="badge badge-pill badge-danger">0</span>
    196                     </a></li>
    197 
    198                     <li class="nav-item d-md-down-none"><a href="#"> <i
    199                             class="fa fa-envelope-open"></i> <span
    200                             class="badge badge-pill badge-danger">0</span>
    201                     </a></li>
    202 
    203                     <li class="nav-item dropdown"><a
    204                         class="nav-link dropdown-toggle" href="#" role="button"
    205                         data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    206                             <img src="./imgs/avatar-1.png" class="avatar avatar-sm"
    207                             alt="logo"> <span class="small ml-1 d-md-down-none">${cookie.name.value}</span>
    208                     </a>
    209 
    210                         <div class="dropdown-menu dropdown-menu-right">
    211                             <div class="dropdown-header">账户</div>
    212 
    213                             <a href="login.jsp" class="dropdown-item"> <i
    214                                 class="fa fa-user"></i> 切换用户
    215                             </a> <a href="#" class="dropdown-item"> <i class="fa fa-envelope"></i>
    216                                 留言内容
    217                             </a>
    218 
    219                             <div class="dropdown-header">设定</div>
    220 
    221                             <a href="#" class="dropdown-item"> <i class="fa fa-bell"></i>
    222                                 通知事项
    223                             </a> <a href="#" class="dropdown-item"> <i class="fa fa-wrench"></i>
    224                                 设置
    225                             </a> <a href="#" class="dropdown-item"> <i class="fa fa-lock"></i>
    226                                 登出
    227                             </a>
    228                         </div></li>
    229                 </ul>
    230             </nav>
    231         </div>
    232         <!-- <div class="main-container"> -->
    233         <div class="sidebar">
    234             <nav class="sidebar-nav">
    235                 <ul class="nav">
    236                     <li class="nav-title">导航</li>
    237 
    238                     <li class="nav-item"><a href="index.jsp" class="nav-link">
    239                             <i class="icon icon-speedometer"></i> 首页
    240                     </a></li>
    241 
    242                     <li class="nav-item nav-dropdown"><a href="#"
    243                         class="nav-link nav-dropdown-toggle"> <i
    244                             class="icon icon-target"></i> 学员信息 <i class="fa fa-caret-left"></i>
    245                     </a>
    246 
    247                         <ul class="nav-dropdown-items">
    248                             <li class="nav-item"><a href="studentShow.jsp"
    249                                 class="nav-link"> <i class="icon"></i> 学员列表
    250                             </a></li>
    251 
    252                             <li class="nav-item"><a href="addtable.jsp"
    253                                 class="nav-link active"> <i class="icon"></i> 学员加入
    254                             </a></li>
    255 
    256                             <li class="nav-item"><a href="studentdel.jsp"
    257                                 class="nav-link"> <i class="icon"></i> 学员离开
    258                             </a></li>
    259 
    260                             <li class="nav-item"><a href="studentxiu.jsp"
    261                                 class="nav-link"> <i class="icon"></i> 学员信息修改
    262                             </a></li>
    263                         </ul></li>
    264 
    265 
    266                     <li class="nav-item nav-dropdown"><a href="#"
    267                         class="nav-link nav-dropdown-toggle"> <i
    268                             class="icon icon-energy"></i> 学员状态 <i class="fa fa-caret-left"></i>
    269                     </a>
    270 
    271                         <ul class="nav-dropdown-items">
    272                             <li class="nav-item"><a href="state_show.jsp"
    273                                 class="nav-link"> <i class="icon"></i> 状态列表
    274                             </a></li>
    275 
    276                             <li class="nav-item"><a href="state.jsp" class="nav-link">
    277                                     <i class="icon"></i> 状态更改
    278                             </a></li>
    279                         </ul></li>
    280 
    281 
    282                     <li class="nav-item nav-dropdown"><a href="#"
    283                         class="nav-link nav-dropdown-toggle"> <i
    284                             class="icon icon-graph"></i> 学员成绩 <i class="fa fa-caret-left"></i>
    285                     </a>
    286 
    287                         <ul class="nav-dropdown-items">
    288                             <li class="nav-item"><a href="tablesone.jsp"
    289                                 class="nav-link"> <i class="icon"></i> 今日成绩
    290                             </a></li>
    291                         </ul>
    292                         <ul class="nav-dropdown-items">
    293                             <li class="nav-item"><a href="tablestwo.jsp"
    294                                 class="nav-link"> <i class="icon"></i> 往日成绩
    295                             </a></li>
    296                         </ul>
    297                         </li>
    298                 </ul>
    299             </nav>
    300         </div>
    301         <div class="content">
    302             <form action="" method="post" id="myform">
    303                 <div class="container-fluid">
    304                     <div class="row">
    305 
    306                         <div class="col-md-10">
    307                             <div class="card">
    308                                 <div class="card-header bg-light">新增学员</div>
    309 
    310                                 <div class="card-body">
    311                                     <div class="row mb-5">
    312                                         <div class="col-md-4 mb-4">
    313                                             <div>基本信息</div>
    314                                         </div>
    315 
    316                                         <div class="col-md-8">
    317                                             <div class="row">
    318                                                 <div class="col-md-6">
    319                                                     <div class="form-group">
    320                                                         <label class="form-control-label">新学生学号</label> <input
    321                                                             type="text" name="pid" id="pid" class="form-control">
    322                                                             <span id=xuehao class="tishi"></span>
    323                                                     </div>
    324                                                 </div>
    325 
    326                                                 <div class="col-md-6">
    327                                                     <div class="form-group">
    328                                                         <label class="form-control-label">新学生姓名</label> <input
    329                                                             type="text" name="name" id="name" class="form-control">
    330                                                             <span id="names" class="tishi"></span>
    331                                                     </div>
    332                                                 </div>
    333                                             </div>
    334 
    335                                             <div class="row">
    336                                                 <div class="col-md-6">
    337                                                     <div class="form-group">
    338                                                         新学生性别:<input type="radio" name="sex" value="男"><input
    339                                                             type="radio" name="sex" value="女">340                                                             <span id="sex" class="tishi"></span>
    341                                                     </div>
    342                                                 </div>
    343                                             </div>
    344 
    345                                             <div class="row">
    346                                                 <div class="col-md-6">
    347                                                     <div class="form-group">
    348                                                         <label class="form-control-label">新学生年龄</label> <input
    349                                                             type="text" name="age" id="age" class="form-control">
    350                                                             <span id="ages" class="tishi"></span>
    351                                                     </div>
    352                                                 </div>
    353                                                 <div class="col-md-6">
    354 
    355                                                     <div class="form-group">
    356                                                         <label for="single-select">新学员小组</label> <select id="team"
    357                                                             name="team" class="form-control">
    358                                                             <option value="">请选择小组</option>
    359                                                             <option value="1">1</option>
    360                                                             <option value="2">2</option>
    361                                                             <option value="3">3</option>
    362                                                             <option value="4">4</option>
    363                                                         </select>
    364                                                         <span id=s7 class="tishi"></span>
    365                                                     </div>
    366                                                 </div>
    367                                             </div>
    368                                         </div>
    369                                     </div>
    370 
    371                                     <hr>
    372 
    373                                     <div class="row mt-5">
    374                                         <div class="col-md-4 mb-4">
    375                                             <div>家庭住址</div>
    376                                         </div>
    377 
    378                                         <div class="col-md-8">
    379                                             <div class="form-group">
    380                                                 <label class="form-control-label"></label><br>省份<select
    381                                                     id="sheng" class="form-control" onchange="ChooseCity(this.value)">
    382                                                     <option value="">请选择省份</option>
    383                                                 </select> 城市<select class="form-control" id="shi" onchange="ChooseQu(this.value)">
    384                                                     <option value="" id="opt1">请选择城市</option>
    385                                                 </select> 区县<select class="form-control" id="xian" onchange="getAdd()">
    386                                                     <option value="" id="opt2">请选择区县</option>
    387                                                 </select>
    388                                                 <span id=s8 class="tishi"></span>
    389                                                 <input type="hidden" name="add" id="add" value="">
    390                                             </div>
    391                                         </div>
    392                                     </div>
    393                                 </div>
    394                                 <div class="card-footer bg-light text-right">
    395                                     <input type="button" onclick="tijiao()" class="btn btn-primary"
    396                                         value="提交">
    397                                 </div>
    398                             </div>
    399                         </div>
    400                     </div>
    401                 </div>
    402             </form>
    403         </div>
    404     </div>
    405 
    406     
    407 
    408 </body>
    409 </html>
  • 相关阅读:
    python 网络爬虫(三)
    python 网络爬虫(二)
    python 网络爬虫(一)
    python 爬虫原理
    (转)栈的生长方向
    CRC校验
    extern关键字
    E
    The Super Powers UVA
    V
  • 原文地址:https://www.cnblogs.com/tang0125/p/12826219.html
Copyright © 2020-2023  润新知