Layui后台实现搜索、添加、删除、编辑、查看功能（以用户管理为例）

Layui开发使用文档地址：https://www.layui.com/doc/

在开始前，请大家先看下上面的开发文档，做好Layui初始化配置，最重要的是学会数据表格的渲染，这对于下面功能的实现起到至关重要的作用，还需要引入jQuery.js.文件。

下面我将会用自己做过的Layui后台中用户管理为例，详细地向大家介绍如何实现后台中的功能，以便大家在使用Layui模板后台或用Layui搭建后台时，能快速实现与数据库的交互，实现功能，少走弯路。

数据库：MySQL
后台：Layui
后端语言：PHP

如下图所示，这是我用户管理的界面（user.html）。

1.搜索功能

这是用户搜索一行的html代码：
然后我们要引入三个js文件：

其中jquery.js和layui.js，大家可以去各自的官网下载。user.js是我们自己要写的js文件，功能的实现全在这个文件中。

接下来就是编写user.js中的搜索功能部分：

$('#search').click(function () {
   
   
		var Nick = $('#user').val();
	     var date = $('#time').val();
	if($('#user').val()==""&&$('#time').val()==""){
   
   
		layer.msg('查询内容不能为空');
		return false;
	}
		table.reload('testReload', {
   
     //table.reload重载数据表格的语法，在文档中有
			url: 'search.php'
			// ,methods:"post"
			,request: {
   
   
				pageName: 'page'  //页码的参数名称，默认：page
				,limitName: 'pageSize'  //每页数据量的参数名，默认：limit
			}
			,where: {
   
   
				// 向search.php传送数据
				start:  date,
				keyword:  Nick
			}
			,page: {
   
   
				curr: 1
			}
		});
		return false;
	})

注意这段代码要放在下面这个function中（所有功能类如添加和删除用户都要放在里面）

layui.use(['layer', 'form'], function(){
   
   
  var layer = layui.layer
  ,form = layui.form;
  
});

最后是search.php文件，代码如下：

<?php
 header('Access-Control-Allow-Origin: *');  //解决跨域问题
 header('Content-Type:application/json');         //定义编码JSON
  //下面函数解决PHP报错Notice: Undefined index
 function _post($str){
   
   
     $val = !empty($_GET[$str]) ? $_GET[$str] : null;
     return $val;
}
//start和keyword对应于上面js代码中的date和Nick
$PersonalRegisterTime=_post('start');
$PersonalNickName=_post('keyword');



// $conn = mysqli_connect("localhost","root",""," myplays");
$servername = "";
$username = "root";
$password = "";
$dbname = " myplays";
$conn = mysqli_connect($servername,$username,$password,$dbname);
 mysqli_query($conn,"set names utf8");
 
$sql = "SELECT * FROM username where PersonalNickName LIKE '%$PersonalNickName%' and PersonalRegisterTime LIKE '%$PersonalRegisterTime%' and judge = '1'";
$resultSet = mysqli_query($conn,$sql);
$sqli =  mysqli_num_rows($resultSet);
//定义一个json函数，将输出结果转化为json格式，才能用数据表格渲染出来
function json($result_number,$result=array()){
   
    
    $result=array(  
      'code'=>$result_number,
      'data'=>$result   
    );  
    //输出json  
    echo json_encode($result);  
    exit;  
}
$dataarr = array(); 
if(mysqli_num_rows($resultSet)>0){
   
    
     
while($row = mysqli_fetch_assoc($resultSet)) {
   
   
    
    $dataarr[]=$row; 
}

echo json(0,$dataarr);//要code：0，表格才能渲染出来


}else{
   
    
    echo json(0,$dataarr);
} 

mysqli_close($conn);
?>

这样一个搜索用户的功能就这样实现了。

2.添加功能

添加功能就需要用到弹出层，弹窗方法。

我们可以使用这个方法来实现。

首先写一个js文件，命名为admin.js文件。
在其中使用layui.define([mods], callback)定义模块。写下代码如下。

/*
	    参数解释：
	    title   标题
	    url     请求的url
	    id      需要操作的数据id
	    w       弹出层宽度（缺省调默认值）
	    h       弹出层高度（缺省调默认值）
	*/
	window.WeAdminShow = function(title, url, w, h) {
   
   
		if(title == null || title == '') {
   
   
			title = false;
		};
		if(url == null || url == '') {
   
   
			url = "404.html";
		};
		if(w == null || w == '') {
   
   
			w = ($(window).width() * 0.9);
		};
		if(h