定制软件PHP连接数据库MySQL打造xxx管理系统，实现简单的增删改查功能

目录

         

         

         

前言

       定制软件最近刚学完PHP和Mysql,定制软件历时半个多月时间完成定制软件了这样一个简单的算是定制软件人员管理系统吧，定制软件为了加深印象总结一下，定制软件还有很多不足之处，定制软件希望大家多多指正，一起学习！

概述

       定制软件完成这个系统我们要用定制软件到的软件有(定制软件大家应该都有），Navicat(定制软件数据库管理工具），XAMPP(定制软件大家如果没有装数据库，定制软件可以在下载时勾选里面的Mysql)。还需在文件中加入layui。

总共有以下这些文件：

 

内容

  • 创建数据库表

  1. 首先我们需要在Navicat中建立两个表，第一个时登录系统的表，主要用于存放账号密码

 

第二个用来实现增删改查的user表

 

连接数据库db.php

  1. <?php
  2. $dsn = "mysql:host=127.0.0.1;port=3306;dbname=system;charset=utf8";
  3. $mysqlAccount = "root";
  4. $mysqlPassword = "";
  5. // 创建PDO对象
  6. $pdo = new PDO($dsn, $mysqlAccount, $mysqlPassword);
  7.  
  8. //设置取值方式
  9. // $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE,PDO::FETCH_ASSOC);

获取图片upload.php

.实现登录

  • login.php

    1. <!DOCTYPE html>
    2. <html lang="en">
    3.  
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8.     <title>管理系统</title>
    9.     <link rel="stylesheet" href="../utils/layui-v2.7.6/css/layui-css">
    10.     <script src="../utils/layui-v2.7.6/layui/layui.js"></script>
    11.     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    12.     <style>
    13.         body {
    14.             background-color: #5FB878;
    15.             /* display: flex;
    16.             justify-content: center;
    17.             align-items: center; */
    18.         }
    19.  
    20.         .box {
    21.             width: 330px;
    22.             height: 230px;
    23.             background-color: #fff;
    24.             position: absolute;
    25.             left: 50%;
    26.             top: 50%;
    27.             transform: translate(-50%, -50%);
    28.             border-radius: 6px;
    29.             box-shadow: rgba(29, 203, 122, 0.3) 0px 0px 0px 3px;
    30.             padding: 30px;
    31.             box-sizing: border-box;
    32.             display: flex;
    33.             flex-direction: column;
    34.             justify-content: space-between;
    35.  
    36.         }
    37.  
    38.         .btns {
    39.             display: flex;
    40.             justify-content: space-between;
    41.         }
    42.     </style>
    43. </head>
    44.  
    45. <body>
    46.     <div class="box">
    47.         <h2>后台管理系统</h2>
    48.         <form class="layui-form" action="../server/server_login.php" method="POST">
    49.             <div class="layui-form-item">
    50.                 
    51.                 <div>
    52.                     <input type="text" name="username" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input">
    53.                 </div>
    54.             </div>
    55.             <div class="layui-form-item">
    56.                 
    57.                 <div >
    58.                     <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
    59.                 </div>
    60.             </div>
    61.             
    62.             <div class="layui-form-item">
    63.                 <div class="layui-input-block">
    64.                     <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
    65.                     <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    66.                 </div>
    67.             </div>
    68.         </form>
    70.     </div>
    71.     <script>
    72.         //Demo
    73.         // layui.use('form', function() {
    74.         //     var form = layui.form;
    75.  
    76.         //     //提交
    77.         //     form.on('submit(formDemo)', function(data) {
    78.         //         layer.msg(JSON.stringify(data.field));
    79.         //         return false;
    80.         //     });
    81.         // });
    82.     </script>
    83. </body>
    84.  
    85. </html>

    server_login.php

    1. <?php
    2.  
    3. require_once '../server/db.php';
    4. //获取账号密码
    5. $username = $_POST['username'];
    6. $password = $_POST['password'];
    7. //定义语句
    8. $sql = "select * from admin where username = '$username' and password = '$password'";
    9.  
    10.  
    11. //执行
    12. $stmt = $pdo->query($sql);
    13. $user = $stmt->fetch();
    14.  
    15. //判断
    16. if(empty($user)){
    17.     //未成功，返回登录页
    18.     echo "<script>alert('账号或密码错误'); history.back();</script>";
    19.  
    20. }else{
    21.     //成功
    22.     session_start();
    23.     //存储session
    24.     $_SESSION['username'] = $user['username'];
    25.     echo "<script>location.href = '../view/userlist.php'</script>";
    26. }

    效果

  •  实现列表

    1. <div class="layui-header">
    2.             <div class="layui-logo layui-hide-xs layui-bg-black">后台管理系统</div>
    3.             <!-- 头部区域（可配合layui 已有的水平导航） -->
    4.             <ul class="layui-nav layui-layout-left">
    5.                 <!-- 移动端显示 -->
    6.                 <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
    7.                     <i class="layui-icon layui-icon-spread-left"></i>
    8.                 </li>
    10.                 <li class="layui-nav-item layui-hide-xs"><a href="">控制台</a></li>
    11.                 <li class="layui-nav-item layui-hide-xs"><a href="">商品管理</a></li>
    12.                 <li class="layui-nav-item layui-hide-xs"><a href="">用户</a></li>
    13.                 <li class="layui-nav-item">
    14.                     <a href="javascript:;">其他</a>
    15.                     <dl class="layui-nav-child">
    16.                         <dd><a href="">menu 11</a></dd>
    17.                         <dd><a href="">menu 22</a></dd>
    18.                         <dd><a href="">menu 33</a></dd>
    19.                     </dl>
    20.                 </li>
    21.             </ul>
    22.             <ul class="layui-nav layui-layout-right">
    23.                 <li class="layui-nav-item layui-hide layui-show-md-inline-block">
    24.                     <a href="javascript:;">
    25.                         <img src="gg.jpg" class="layui-nav-img">
    26.                         tester
    27.                     </a>
    28.                     <dl class="layui-nav-child">
    29.                         <dd><a href="">Your Profile</a></dd>
    30.                         <dd><a href="">Settings</a></dd>
    31.                         <dd><a href="">Sign out</a></dd>
    32.                     </dl>
    33.                 </li>
    34.                 <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
    35.                     <a href="javascript:;">
    36.                         <i class="layui-icon layui-icon-more-vertical"></i>
    37.                     </a>
    38.                 </li>
    39.             </ul>
    40.         </div>
    42.         <div class="layui-side layui-bg-black">
    43.             <div class="layui-side-scroll">
    44.                 <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
    45.                 <ul class="layui-nav layui-nav-tree" lay-filter="test">
    46.                     <li class="layui-nav-item layui-nav-itemed">
    47.                         <a class="" href="javascript:;">所有用户</a>
    48.                         <dl class="layui-nav-child">
    49.                             <dd><a href="javascript:;">用户列表</a></dd>
    50.                             <dd><a href="javascript:;">添加用户</a></dd>
    51.                             <dd><a href="javascript:;">menu 3</a></dd>
    52.                             <dd><a href="">the links</a></dd>
    53.                         </dl>
    54.                     </li>
    55.                     <li class="layui-nav-item">
    56.                         <a href="javascript:;">新闻管理</a>
    57.                         <dl class="layui-nav-child">
    58.                             <dd><a href="javascript:;">list 1</a></dd>
    59.                             <dd><a href="javascript:;">list 2</a></dd>
    60.                             <dd><a href="">超链接</a></dd>
    61.                         </dl>
    62.                     </li>
    63.                     <li class="layui-nav-item"><a href="javascript:;">云市场</a></li>
    64.                     <li class="layui-nav-item"><a href="">发布商品</a></li>
    65.                 </ul>
    66.             </div>
    67.         </div>

    userlist.php

    1. <?php
    2. session_start();
    3. // $_SESSION['username']
    4. if (empty($_SESSION['username'])) {
    5.     echo "<script>alert('请先登录');location.href = './login.php'</script>";
    6. }
    7.  
    8. //引入数据库连接文件
    9. require_once '../server/server_userlist.php';
    10.  
    11. ?>
    12. <!DOCTYPE html>
    13. <html>
    14.  
    15. <head>
    16.     <meta charset="UTF-8">
    17.     <meta name="viewport" content="width=device-width">
    18.     <title>首页</title>
    19.     <link rel="stylesheet" href="../utils/layui-v2.7.6/layui/css/layui.css">
    20.     <script src="../utils/layui-v2.7.6/layui/layui.js"></script>
    21.     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    22. </head>
    23.  
    24. <style>
    25.     .btn1 {
    26.         padding: 15px;
    27.     }
    28.  
    29.     img {
    30.         width: 30px;
    31.         height: 30px;
    32.     }
    33. </style>
    34.  
    35. <body>
    36.     <div class="layui-layout layui-layout-admin">
    38.         <?php include './nav.php' ?>
    39.         <div class="layui-body">
    40.             <!-- 内容主体区域 -->
    42.             <div style="padding: 15px;">
    44.                 <!-- 页面主体内容 -->
    45.                 <button type="buttton" class="layui-btn" onclick="location.href= 'useradd.php'">
    46.                     <i class="layui-icon layui-icon-add-circle-fine"></i> 新增用户
    47.                 </button>
    49.                 <!-- 显示用户信息的表格 -->
    50.                 <table class="layui-table">
    51.                     <colgroup>
    52.                         <col width="150">
    53.                         <col width="200">
    54.                         <col>
    55.                     </colgroup>
    56.                     <thead>
    57.                         <tr>
    58.                             <th>编号</th>
    59.                             <th>账号</th>
    60.                             <th>密码</th>
    61.                             <th>姓名</th>
    62.                             <th>头像</th>
    63.                             <th>身份</th>
    64.                             <th>年龄</th>
    65.                             <th>生日</th>
    66.                             <th>创建时间</th>
    67.                             <th>操作</th>
    68.                         </tr>
    69.                     </thead>
    70.                     <tbody>
    71.                         <?php
    72.                         foreach ($users as $user) {
    73.                             echo "<tr>
    74.                      <td>{$user['id']}</td>
    75.                      <td>{$user['username']}</td>
    76.                      <td>{$user['password']}</td>
    77.                      <td>{$user['name']}</td>
    78.                      <td><img src='{$user['icon']}'></td> 
    79.                      <td>{$user['type_name']}</td>
    80.                      <td>{$user['age']}</td>
    81.                      <td>{$user['birthday']}</td>
    82.                      <td>{$user['ctime']}</td>
    83.                      <td>
    85.                      <button type='button' class='layui-btn layui-btn-normal layui-btn-sm ' onclick='toEditPage(${user['id']})'>编辑</button>
    86.                      <button type='button' class='layui-btn layui-btn-danger layui-btn-sm ' onclick='delUser(${user['id']},\"{$user['name']}\")'>删除</button>
    87.                      </td>
    88.                      
    89.                      </tr>";
    90.                         }
    91.                         ?>
    92.                     </tbody>
    93.                 </table>
    94.  
    95.                 <!-- 分页 -->
    96.                 <div id="test1"></div>
    97.             </div>
    98.         </div>
    99.  
    100.  
    101.         <div class="layui-footer">
    102.             <!-- 底部固定区域 -->
    103.             底部固定区域
    104.         </div>
    105.     </div>
    107.     <!-- <script src="./layui/layui.js"></script> -->
    108.     <script>
    109.         //删除用户
    110.         function delUser(id,name) {
    111.             layer.confirm('确定要删除'+name+'吗?', {
    112.                 icon: 3,
    113.                 title: '提示'
    114.             }, function(index) {
    115.                 window.location.href = '../server/server_userdelete.php?id=' + id;
    116.                 layer.close(index);
    117.  
    118.             });
    119.         }
    120.  
    121.         //编辑用户
    122.         function toEditPage(id) {
    123.  
    124.             window.location.href = "./useredit.php?id=" + id;
    125.         
    126.         }
    127.  
    128.  
    129.         // JS分页相关
    130.         layui.use('laypage', function() {
    131.             var laypage = layui.laypage;
    132.  
    133.             //执行一个laypage实例
    134.             laypage.render({
    135.                 elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号
    136.                     ,
    137.                 count: 50 //数据总数，从服务端得到
    138.             });
    139.         });
    140.  
    141.         //JS 
    142.         layui.use(['element', 'layer', 'util'], function() {
    143.             var element = layui.element,
    144.                 layer = layui.layer,
    145.                 util = layui.util,
    146.                 $ = layui.$;
    147.  
    148.             //头部事件
    149.             util.event('lay-header-event', {
    150.                 //左侧菜单事件
    151.                 menuLeft: function(othis) {
    152.                     layer.msg('展开左侧菜单的操作', {
    153.                         icon: 0
    154.                     });
    155.                 },
    156.                 menuRight: function() {
    157.                     layer.open({
    158.                         type: 1,
    159.                         content: '<div style="padding: 15px;">处理右侧面板的操作</div>',
    160.                         area: ['260px', '100%'],
    161.                         offset: 'rt' //右上角
    162.                             ,
    163.                         anim: 5,
    164.                         shadeClose: true
    165.                     });
    166.                 }
    167.             });
    168.  
    169.         });
    170.     </script>
    171. </body>
    172.  
    173. </html>

    server_userlist.php

    1. <!-- 通过数据库获取用户数据 -->
    2. <?php
    3. //引入数据库连接文件
    4. require_once '../server/db.php';
    5.  
    6. //定义sql语句
    7. $sql = "select * from user";
    8.  
    9. //执行查询
    10. $stmt = $pdo->query($sql);
    11.  
    12. //处理结果集
    13. $users = $stmt->fetchAll();
    14.  
    15. date_default_timezone_set('Asia/Shanghai');
    16. // echo "<pre>";
    17. // foreach ($users as $v){
    18.     
    19. //     print_r($v);
    20. // }
    21. //对结果集中数据做转换
    22.  
    23. foreach ($users as &$item) {
    24.     switch($item['type']) {
    25.         case 0:
    26.             $item['type_name'] = '校长';
    27.             break;
    28.         case 1:
    29.             $item['type_name'] = '教师';
    30.             break;
    31.         case 2:
    32.             $item['type_name'] = '学生';
    33.             break;       
    34.     }
    35.  
    36. $item['ctime'] = date('Y-m-d H-i-s',$item['create_time']);
    37. }
    38.

    效果

  • 新增用户 

  • useradd.php
    1. <?php
    2. session_start();
    3. // $_SESSION['username']
    4. if (empty($_SESSION['username'])) {
    5.     echo "<script>alert('请先登录');location.href = './login.php'</script>";
    6. }
    7.  
    8. //引入数据库连接文件
    9.  
    10. ?>
    11. <!DOCTYPE html>
    12. <html>
    13.  
    14. <head>
    15.     <meta charset="UTF-8">
    16.     <meta name="viewport" content="width=device-width">
    17.     <title>新增用户</title>
    18.     <link rel="stylesheet" href="../utils/layui-v2.7.6/layui/css/layui.css">
    19.     <script src="../utils/layui-v2.7.6/layui/layui.js"></script>
    20.     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    21. </head>
    22.  
    23. <style>
    24.     .btn1 {
    25.         padding: 15px;
    26.     }
    27.  
    28.     #show_img {
    29.         width: 40px;
    30.         height: 40px;
    31.         display: none;
    32.     }
    33. </style>
    34.  
    35. <body>
    36.     <div class="layui-layout layui-layout-admin">
    38.         <?php include './nav.php' ?>
    39.         <div class="layui-body">
    40.             <!-- 内容主体区域 -->
    42.             <div style="padding: 15px;width: 450px;">
    43.                 <!-- 新增用户的表单 -->
    45.                 <form class="layui-form" action="../server/server_useradd.php" method="POST">
    46.                     <div class="layui-form-item">
    47.                         <label class="layui-form-label">账号</label>
    48.                         <div class="layui-input-block">
    49.                             <input type="text" name="username" required lay-verify="required" placeholder="请输入编号" autocomplete="off" class="layui-input">
    50.                         </div>
    51.                     </div>
    53.                     <div class="layui-form-item">
    54.                         <label class="layui-form-label">密码</label>
    55.                         <div class="layui-input-block">
    56.                             <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
    57.                         </div>
    58.                     </div>
    60.                     <form class="layui-form" action="">
    61.                         <div class="layui-form-item">
    62.                             <label class="layui-form-label">姓名</label>
    63.                             <div class="layui-input-block">
    64.                                 <input type="text" name="name" required lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
    65.                             </div>
    66.                         </div>
    68.                         <div class="layui-form-item">
    69.                             <label class="layui-form-label">身份</label>
    70.                             <div class="layui-input-block">
    71.                                 <input type="radio" name="type" value="0" title="校长">
    72.                                 <input type="radio" name="type" value="1" title="教师">
    73.                                 <input type="radio" name="type" value="2" title="学生" checked>
    74.                             </div>
    75.                         </div>
    77.                         <div class="layui-form-item">
    78.                             <div class="layui-form-item">
    79.                                 <label class="layui-form-label">年龄</label>
    80.                                 <div class="layui-input-block">
    81.                                     <input type="text" name="age" required lay-verify="required" placeholder="请输入年龄" autocomplete="off" class="layui-input">
    82.                                 </div>
    83.                             </div>
    85.                             <div class="layui-form-item">
    86.                                 <div class="layui-form-item">
    87.                                     <label class="layui-form-label">生日</label>
    88.                                     <div class="layui-input-block">
    89.                                         <input type="text" name="birthday" class="layui-input" id="birthday">
    90.                                     </div>
    91.                                 </div>
    93.                                 <div class="layui-form-item">
    94.                                     <div class="layui-form-item">
    95.                                         <label class="layui-form-label">头像</label>
    96.                                         <input type="hidden" name="icon">
    97.                                         <div class="layui-input-block">
    98.                                             <button type="button" class="layui-btn" id="pic">
    99.                                                 <i class="layui-icon">&#xe67c;</i>上传图片
    100.                                             </button>
    101.                                             <img src=" " alt="" id="show_img">
    103.                                         </div>
    104.                                     </div>
    106.                                     <div class="layui-form-item">
    107.                                         <div class="layui-input-block">
    108.                                             <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
    109.                                             <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    110.                                         </div>
    111.                                     </div>
    112.                     </form>
    114.             </div>
    115.         </div>
    117.         <div class="layui-footer">
    118.             <!-- 底部固定区域 -->
    119.             底部固定区域
    120.         </div>
    121.     </div>
    123.     <!-- <script src="./layui/layui.js"></script> -->
    124.     <script>
    125.         //js
    126.         // layui.use('form', function(){
    127.         //   var form = layui.form;
    128.  
    129.         //   //监听提交
    130.         //   form.on('submit(formDemo)', function(data){
    131.  
    132.         //     return false;
    133.         //   });
    134.         // });
    135.  
    136.         //头像上传相关操作
    137.         layui.use('upload', function() {
    138.             var upload = layui.upload;
    139.  
    140.             //执行实例
    141.             var uploadInst = upload.render({
    142.                 elem: '#pic' //绑定元素
    143.                     ,
    144.                 url: '../server/upload.php' //上传接口
    145.                     ,
    146.                 field:'pic',
    147.                 done: function(res) {
    148.                     console.log(res);
    149.                     //上传完毕回调
    150.                     $("input[name='icon']").attr("value",res.data.path);
    151.                     $("input[name='pic']").attr("value",res.data.path);
    152.  
    153.                     $("#show_img").attr("src",res.data.path).css('display',"inline-block")
    154.                 },
    155.                 error: function() {
    156.                     //请求异常回调
    157.                 }
    158.             });
    159.         });
    160.     //   日期相关操作
    161.         layui.use('laydate', function() {
    162.             var laydate = layui.laydate;
    163.  
    164.             //执行一个laydate实例
    165.             laydate.render({
    166.                 elem: '#birthday' //指定元素
    167.             });
    168.         });
    169.         //JS 
    170.         layui.use(['element', 'layer', 'util'], function() {
    171.             var element = layui.element,
    172.                 layer = layui.layer,
    173.                 util = layui.util,
    174.                 $ = layui.$;
    175.  
    176.             //头部事件
    177.             util.event('lay-header-event', {
    178.                 //左侧菜单事件
    179.                 menuLeft: function(othis) {
    180.                     layer.msg('展开左侧菜单的操作', {
    181.                         icon: 0
    182.                     });
    183.                 },
    184.                 menuRight: function() {
    185.                     layer.open({
    186.                         type: 1,
    187.                         content: '<div style="padding: 15px;">处理右侧面板的操作</div>',
    188.                         area: ['260px', '100%'],
    189.                         offset: 'rt' //右上角
    190.                             ,
    191.                         anim: 5,
    192.                         shadeClose: true
    193.                     });
    194.                 }
    195.             });
    196.  
    197.         });
    198.     </script>
    199. </body>
    200.  
    201. </html>

    server_useradd.php

    1. <!-- 新增用户的后端操作 -->
    2.  
    3. <?php
    4.  
    5. //引入数据库连接文件
    6. require_once './db.php';
    7. //获取表单参数
    8. $username = $_POST['username'] ;
    9. $password = $_POST['password'] ;
    10. $name = $_POST['name'] ;
    11. $type = $_POST['type'];
    12. $age = $_POST['age'] ;
    13. $birthday = $_POST['birthday'] ;
    14. $icon = $_POST['icon'] ;
    15. $create_time = time();
    16.  
    17. //定义sql语句
    18. $sql = "insert into user values (null,'$username','$password','$name','$icon',$type,$age,'$birthday',$create_time)";
    19.  
    20. //执行
    21. $isSuccess = $pdo->exec($sql);
    22.  
    23. //判断并处理结果
    24. if($isSuccess) {
    25.     echo "<script>location.href = '../view/userlist.php'</script>";
    26. }else{
    27.     echo "<script>alert('新增失败');location.href = '../view/useradd.php'</script>";
    28. }

    效果

  • 删除用户 

  • server_userdelete.php
    1. <?php
    2.  
    3. //引入数据库连接文件
    4. require_once './db.php';
    5.  
    6. //获取参数
    7. $id = $_GET['id'];
    8.  
    9. //定义sql
    10. $sql = "delete from user where id = " .$id;
    11. //执行sql
    12.  
    13. $isSuccess = $pdo->exec($sql);
    14.  
    15. //判断并处理结果
    16. if($isSuccess) {
    17.     echo "<script>location.href = '../view/userlist.php'</script>";
    18. }else{
    19.     echo "<script>alert('删除失败');location.href = '../view/userlist.php'</script>";
    20. }

    效果

  •  编辑用户

  • useredit.php
    1. <?php
    2.  
    3. include '../server/server_useredit.php'
    4. ?>
    5.  
    6. <!DOCTYPE html>
    7. <html>
    8.  
    9. <head>
    10.     <meta charset="UTF-8">
    11.     <meta name="viewport" content="width=device-width">
    12.     <title>编辑用户</title>
    13.     <link rel="stylesheet" href="../utils/layui-v2.7.6/layui/css/layui.css">
    14.     <script src="../utils/layui-v2.7.6/layui/layui.js"></script>
    15.     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    16. </head>
    17.       <style>
    18.         .btn1{
    19.          padding: 15px;
    20.         }
    21.         img{
    22.          width: 30px;
    23.          height: 30px;
    24.         }
    25.         </style>
    26. <body>
    27.   <div class="layui-layout layui-layout-admin">
    28.     
    29.     <?php
    30.    include './nav.php'
    31.     ?>
    33.     <?php $id=$_GET['id'] ?>
    35.     <div class="layui-body">
    36.       
    37.       <!-- 内容主体区域 -->
    38.       <div style="padding:15px;width:450px">
    39.         <!-- 添加用户按钮 -->
    40.         <button type="button" class="layui-btn layui-btn-sm layui-btn" onclick="location.href='./userlist.php'">
    41.           <i class="layui-icon layui-icon-left ">返回</i>
    42.         </button>
    46.         <form class="layui-form" action="../server/server_userupdate.php" method="POST">
    47.      
    48.           <div class="layui-input-block">
    49.           </div>
    51.           <div class="layui-form-item">
    52.             <label class="layui-form-label">姓名</label>
    53.             <div class="layui-input-block"> 
    54.            <?php echo "<input type='text' name='name' required lay-verify='required' placeholder='{$name}'   autocomplete='off' class='layui-input'>"; ?>  
    55.             </div>
    56.           </div>
    58.         
    59.           <div class="layui-form-item">
    60.             <label class="layui-form-label">账号</label>
    61.             <div class="layui-input-block">
    62.             <?php echo " <input type='text' name='username'  placeholder='{$username}'  autocomplete='off' class='layui-input' >" ?>  
    63.             </div>
    64.           </div>
    67.           <div class="layui-form-item">
    68.             <label class="layui-form-label">密码</label>
    69.             <div class="layui-input-block">
    70.             <?php echo" <input type='password' name='password' required lay-verify='required' placeholder='{$password}' autocomplete='off' class='layui-input'>"; ?>
    71.             </div>
    72.           </div>
    74.           <div class="layui-form-item">
    75.             <label class="layui-form-label">年龄</label>
    76.             <div class="layui-input-block">
    77.             <?php echo "<input type='text' name='age' required lay-verify='required'  placeholder='{$age}' autocomplete='off' class='layui-input'>" ?>   
    78.             </div>
    79.           </div>
    81.           <div class="layui-form-item">
    82.             <label class="layui-form-label">出生日期</label>
    83.             <div class="layui-input-block">
    84.             <?php echo " <input type='text' name='birthday'  placeholder='{$birthday}'  class='layui-input' id='birthday'>" ?>  
    85.             </div>
    86.           </div>
    89.           <?php
    90.           $check0="";
    91.           $check1="";
    92.           $check2="";
    93.           switch($type){
    94.             case 0:
    95.               $check0="checked";
    96.               break;
    97.             case 1:
    98.               $check1="checked";
    99.               break;
    100.             case 2:
    101.                 $check2="checked";
    102.                 break;
    103.           }
    104.           ?>
    106.           <div class="layui-form-item">
    107.             <label class="layui-form-label">身份</label>
    108.             <div class="layui-input-block" >
    109.               <input type="radio" name="type" value="0" title="校长" <?php echo $check0; ?>>
    110.               <input type="radio" name="type" value="1" title="老师" <?php echo $check1; ?>>
    111.               <input type="radio" name="type" value="2" title="学生" <?php echo $check2; ?>>
    112.             </div>
    113.           </div>
    115.           <div class="layui-form-item">
    116.             <label class="layui-form-label">头像</label>
    117.             <input type="hidden" name="icon">
    118.             <div class="layui-input-block">
    119.               <button type="button" class="layui-btn" id="pic">
    120.                 <i class="layui-icon">&#xe67c;</i>更换头像
    121.               </button>
    122.               <img src="" id="show_img">
    123.             </div>
    124.           </div>
    125.           
    126.           
    127.           <input type='hidden' name='id' value='<?php echo $id ?>' class='layui-input' > 
    129.           
    130.           <div class="layui-form-item">
    131.             <div class="layui-input-block">
    132.           
    133.               <button class="layui-btn" lay-submit lay-filter="formDemo" >立即提交</button>
    134.               <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    135.             </div>
    136.           </div>
    137.         </form>
    139. </div>
    140. </div>
    142. <div class="layui-footer">
    143. <!-- 底部固定区域 -->
    144. </div>
    145. </div>
    147. <script>
    148.     layui.use('upload', function() {
    149.       var upload = layui.upload;
    151.       //执行实例
    152.       var uploadInst = upload.render({
    153.         elem: '#pic' //绑定元素
    154.           ,
    155.         url: '../server/upload.php' //上传接口
    156.           ,
    157.         field: 'pic',
    158.         done: function(res) {
    159.           //上传完毕回调
    160.           $("input[name='icon']").attr("value",res.data.path);
    161.           $("#show_img").attr("src",res.data.path).css('display','inline-block');
    162.         },
    163.         error: function() {
    164.           //请求异常回调
    165.  
    166.         }
    167.  
    168.       });
    169.     });
    170.     </script>
    171.  
    172. <script>
    173. // <!-- 出生日期的script -->
    174.     layui.use('laydate', function() {
    175.       var laydate = layui.laydate;
    176.  
    177.       //执行一个laydate实例
    178.       laydate.render({
    179.         elem: '#birthday' //指定元素
    180.       });
    181.     });
    182.   </script>
    183.  
    184. <script>
    185. //JS 
    186. layui.use(['element', 'layer', 'util'], function() {
    187. var element = layui.element,
    188. layer = layui.layer,
    189. util = layui.util,
    190. $ = layui.$;
    191.  
    192. //头部事件
    193. util.event('lay-header-event', {
    194. //左侧菜单事件
    195. menuLeft: function(othis) {
    196. layer.msg('展开左侧菜单的操作', {
    197.   icon: 0
    198. });
    199. },
    200. menuRight: function() {
    201. layer.open({
    202.   type: 1,
    203.   content: '<div style="padding: 15px;">处理右侧面板的操作</div>',
    204.   area: ['260px', '100%'],
    205.   offset: 'rt' //右上角
    206.     ,
    207.   anim: 5,
    208.   shadeClose: true
    209. });
    210. }
    211. });
    212.  
    213. });
    214. </script>
    215. </body>
    216.  
    217. </html>

    server_useredit.php

    1. <?php
    2.  
    3. //引入数据库连接文件
    4.  
    5. require_once '../server/db.php';
    6.  
    7.  
    8. $id=$_GET['id'];
    9. $sql="select * from user where id=".$id;
    10. // echo $sql;
    11. $stmt=$pdo->query($sql);
    12. $user=$stmt->fetch();
    13.  
    14.  
    15.  
    16. $ids=$user["id"];
    17. $name=$user["name"];
    18. $username=$user["username"];
    19. $password=$user["password"];
    20. $age=$user["age"];
    21. $birthday= $user["birthday"];
    22. $type= $user["type"];
    23. $icon=$user["icon"];
    24.  
    25.  
    26.  
    27.  
    28.  
    29.

    server_userupdate.php

    1. <?php
    2. //引入数据库连接文件
    3.  
    4. require_once './db.php';
    5. //获取表单参数
    6. $username = $_POST["username"];
    7. $name = $_POST["name"];
    8. $password = $_POST["password"];
    9. $age = $_POST["age"];
    10. $birthday = $_POST["birthday"];
    11. $type = $_POST["type"];
    12. $icon = $_POST["icon"];
    13. $id = $_POST["id"];
    14.  
    15.  
    16. $sql = "update user set username='$username',name='$name',password='$password',age=$age,birthday='$birthday',type=$type,icon='$icon' where  id='$id'";
    17.  
    18. print_r($sql);
    19. $stmt = $pdo->exec($sql);
    20. if ($stmt == true) {
    21.     echo "<script>location.href='../view/userlist.php';</script>";
    22. } else {
    23.     echo "<script>alert('更新失败！');location.href='../view/useredit.php';</script>";
    24. }

    效果

  •  

网站建设定制开发 软件系统开发定制 定制软件开发 软件开发定制 定制app开发 app开发定制 app开发定制公司 电商商城定制开发 定制小程序开发 定制开发小程序 客户管理系统开发定制 定制网站 定制开发 crm开发定制 开发公司 小程序开发定制 定制软件 收款定制开发 企业网站定制开发 定制化开发 android系统定制开发 定制小程序开发费用 定制设计 专注app软件定制开发 软件开发定制定制 知名网站建设定制 软件定制开发供应商 应用系统定制开发 软件系统定制开发 企业管理系统定制开发 系统定制开发