程序员最近都爱上了这个网站  程序员们快来瞅瞅吧!  it98k网:it98k.com

本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

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

发布于2022-12-03 15:32     阅读(1086)     评论(0)     点赞(22)     收藏(0)


目录

前言

概述

内容

创建数据库表

实现列表

         新增用户 

         删除用户 

         编辑用户


前言

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

概述

       完成这个系统我们要用到的软件有VScode(大家应该都有),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. // $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE,PDO::FETCH_ASSOC);

获取图片upload.php

.实现登录

  • login.php

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

    server_login.php

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

    效果

  •  实现列表

    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>
    9. <li class="layui-nav-item layui-hide-xs"><a href="">控制台</a></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">
    13. <a href="javascript:;">其他</a>
    14. <dl class="layui-nav-child">
    15. <dd><a href="">menu 11</a></dd>
    16. <dd><a href="">menu 22</a></dd>
    17. <dd><a href="">menu 33</a></dd>
    18. </dl>
    19. </li>
    20. </ul>
    21. <ul class="layui-nav layui-layout-right">
    22. <li class="layui-nav-item layui-hide layui-show-md-inline-block">
    23. <a href="javascript:;">
    24. <img src="gg.jpg" class="layui-nav-img">
    25. tester
    26. </a>
    27. <dl class="layui-nav-child">
    28. <dd><a href="">Your Profile</a></dd>
    29. <dd><a href="">Settings</a></dd>
    30. <dd><a href="">Sign out</a></dd>
    31. </dl>
    32. </li>
    33. <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
    34. <a href="javascript:;">
    35. <i class="layui-icon layui-icon-more-vertical"></i>
    36. </a>
    37. </li>
    38. </ul>
    39. </div>
    40. <div class="layui-side layui-bg-black">
    41. <div class="layui-side-scroll">
    42. <!-- 左侧导航区域(可配合layui已有的垂直导航) -->
    43. <ul class="layui-nav layui-nav-tree" lay-filter="test">
    44. <li class="layui-nav-item layui-nav-itemed">
    45. <a class="" href="javascript:;">所有用户</a>
    46. <dl class="layui-nav-child">
    47. <dd><a href="javascript:;">用户列表</a></dd>
    48. <dd><a href="javascript:;">添加用户</a></dd>
    49. <dd><a href="javascript:;">menu 3</a></dd>
    50. <dd><a href="">the links</a></dd>
    51. </dl>
    52. </li>
    53. <li class="layui-nav-item">
    54. <a href="javascript:;">新闻管理</a>
    55. <dl class="layui-nav-child">
    56. <dd><a href="javascript:;">list 1</a></dd>
    57. <dd><a href="javascript:;">list 2</a></dd>
    58. <dd><a href="">超链接</a></dd>
    59. </dl>
    60. </li>
    61. <li class="layui-nav-item"><a href="javascript:;">云市场</a></li>
    62. <li class="layui-nav-item"><a href="">发布商品</a></li>
    63. </ul>
    64. </div>
    65. </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. require_once '../server/server_userlist.php';
    9. ?>
    10. <!DOCTYPE html>
    11. <html>
    12. <head>
    13. <meta charset="UTF-8">
    14. <meta name="viewport" content="width=device-width">
    15. <title>首页</title>
    16. <link rel="stylesheet" href="../utils/layui-v2.7.6/layui/css/layui.css">
    17. <script src="../utils/layui-v2.7.6/layui/layui.js"></script>
    18. <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    19. </head>
    20. <style>
    21. .btn1 {
    22. padding: 15px;
    23. }
    24. img {
    25. width: 30px;
    26. height: 30px;
    27. }
    28. </style>
    29. <body>
    30. <div class="layui-layout layui-layout-admin">
    31. <?php include './nav.php' ?>
    32. <div class="layui-body">
    33. <!-- 内容主体区域 -->
    34. <div style="padding: 15px;">
    35. <!-- 页面主体内容 -->
    36. <button type="buttton" class="layui-btn" onclick="location.href= 'useradd.php'">
    37. <i class="layui-icon layui-icon-add-circle-fine"></i> 新增用户
    38. </button>
    39. <!-- 显示用户信息的表格 -->
    40. <table class="layui-table">
    41. <colgroup>
    42. <col width="150">
    43. <col width="200">
    44. <col>
    45. </colgroup>
    46. <thead>
    47. <tr>
    48. <th>编号</th>
    49. <th>账号</th>
    50. <th>密码</th>
    51. <th>姓名</th>
    52. <th>头像</th>
    53. <th>身份</th>
    54. <th>年龄</th>
    55. <th>生日</th>
    56. <th>创建时间</th>
    57. <th>操作</th>
    58. </tr>
    59. </thead>
    60. <tbody>
    61. <?php
    62. foreach ($users as $user) {
    63. echo "<tr>
    64. <td>{$user['id']}</td>
    65. <td>{$user['username']}</td>
    66. <td>{$user['password']}</td>
    67. <td>{$user['name']}</td>
    68. <td><img src='{$user['icon']}'></td>
    69. <td>{$user['type_name']}</td>
    70. <td>{$user['age']}</td>
    71. <td>{$user['birthday']}</td>
    72. <td>{$user['ctime']}</td>
    73. <td>
    74. <button type='button' class='layui-btn layui-btn-normal layui-btn-sm ' onclick='toEditPage(${user['id']})'>编辑</button>
    75. <button type='button' class='layui-btn layui-btn-danger layui-btn-sm ' onclick='delUser(${user['id']},\"{$user['name']}\")'>删除</button>
    76. </td>
    77. </tr>";
    78. }
    79. ?>
    80. </tbody>
    81. </table>
    82. <!-- 分页 -->
    83. <div id="test1"></div>
    84. </div>
    85. </div>
    86. <div class="layui-footer">
    87. <!-- 底部固定区域 -->
    88. 底部固定区域
    89. </div>
    90. </div>
    91. <!-- <script src="./layui/layui.js"></script> -->
    92. <script>
    93. //删除用户
    94. function delUser(id,name) {
    95. layer.confirm('确定要删除'+name+'吗?', {
    96. icon: 3,
    97. title: '提示'
    98. }, function(index) {
    99. window.location.href = '../server/server_userdelete.php?id=' + id;
    100. layer.close(index);
    101. });
    102. }
    103. //编辑用户
    104. function toEditPage(id) {
    105. window.location.href = "./useredit.php?id=" + id;
    106. }
    107. // JS分页相关
    108. layui.use('laypage', function() {
    109. var laypage = layui.laypage;
    110. //执行一个laypage实例
    111. laypage.render({
    112. elem: 'test1' //注意,这里的 test1 是 ID,不用加 # 号
    113. ,
    114. count: 50 //数据总数,从服务端得到
    115. });
    116. });
    117. //JS
    118. layui.use(['element', 'layer', 'util'], function() {
    119. var element = layui.element,
    120. layer = layui.layer,
    121. util = layui.util,
    122. $ = layui.$;
    123. //头部事件
    124. util.event('lay-header-event', {
    125. //左侧菜单事件
    126. menuLeft: function(othis) {
    127. layer.msg('展开左侧菜单的操作', {
    128. icon: 0
    129. });
    130. },
    131. menuRight: function() {
    132. layer.open({
    133. type: 1,
    134. content: '<div style="padding: 15px;">处理右侧面板的操作</div>',
    135. area: ['260px', '100%'],
    136. offset: 'rt' //右上角
    137. ,
    138. anim: 5,
    139. shadeClose: true
    140. });
    141. }
    142. });
    143. });
    144. </script>
    145. </body>
    146. </html>

    server_userlist.php

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

    效果

  • 新增用户 

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

    server_useradd.php

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

    效果

  • 删除用户 

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

    效果

  •  编辑用户

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

    server_useredit.php

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

    server_userupdate.php

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

    效果

  •  




所属网站分类: 技术文章 > 博客

作者:小猪佩奇身上纹

链接:http://www.qianduanheidong.com/blog/article/459383/e2770f919b5be66a8721/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

22 0
收藏该文
已收藏

评论内容:(最多支持255个字符)