h话不多说,看图,点击删除,出现确认框,然后点击确认删除,直接删除数据,

因为是基于面向过程的,没有用php框架写,所以有3个文件:

第一个文件:data.php:用于从数据库中获取数据

<?php
try{
$pdo = new PDO("mysql:host=localhost;dbname=test","root","root"); 
}
catch(PDOException $e){
echo "数据库连接失败:".$e->getMessage();
exit;
}

$query = "select * from info";
$pdostatement = $pdo->query($query); 
$result = $pdostatement->fetchAll(PDO::FETCH_ASSOC);

第二个文件:index.php 展示页面;

<?php
include "./data.php";
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<link rel="stylesheet" href="./css/layui.css" media="all">

</head>
<body>
<table class="layui-table">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>ID</th>
<th>名称></th>
<th>级别</th>
<th>编号</th>
<th>操作</th>
</tr> 
</thead>
<tbody>
<?php foreach($result as $key=>$v):?>
<tr>
<td><?php echo $v['id']?></td>
<td><?php echo $v['name']?></td>
<td><?php echo $v['level']?></td>
<td><?php echo $v['code_name']?></td>
<td><button class="delete">删除</button></td>
</tr>
<?php endforeach;?>
</tbody>
</table>
</body>
</html>
<script src="./layui/layui.js"></script>
<script src="./js/jquery-1.10.2.min.js"></script>
<script>
$(function(){
layui.use('layer', function(){
var layer = layui.layer;
$(".delete").click(function(){
var id =$(this).parents('tr').find('td').eq(0).html();
layer.confirm("确认删除?",function(){
layer.msg(id);
$.ajax({
url: "./do_delete.php" ,
data: {'id':id} ,
type: "post" ,
dataType:'json',
success:function(data){
if(data.code==200){
location.reload();
}else{
layer.msg("删除失败");
}
}
})
})
})
});

})
</script>

第三个页面:do_delete.php :ajax的处理页面:

<?php 
try{
$pdo = new PDO("mysql:host=localhost;dbname=test","root","root"); 
}
catch(PDOException $e){
echo "数据库连接失败:".$e->getMessage();
exit;
}

$id = $_POST["id"];
$query = "delete from info where id='$id'";
$result = $pdo->exec($query); 
if($result){
echo json_encode(array("code"=>200));
}else{
echo json_encode(array('code'=>400));
}

上面就是全部代码,基于mvc的也是一样的思路,比这个更简单,可以自己试试看,

基于layui的表格异步删除,ajax的简单运用的更多相关文章

  1. 基于layui,Jquery 表格动态编辑 设置 编辑值为 int 或者 double 类型及默认值

    首先先推荐大家在看这篇笔记时,阅读过我写的这篇 Layui表格编辑[不依赖Layui的动态table加载] 阅读过上面那篇笔记之后呢,才能更好的理解我现在所要说的这个东西 接下来废话不多说,上代码. ...

  2. python操作三大主流数据库(6)python操作mysql⑥新闻管理后台功能的完善(增、ajax异步删除新闻、改、查)

    python操作mysql⑥新闻管理后台功能的完善(增.删.改.查)安装表单验证D:\python\python_mysql_redis_mongodb\version02>pip instal ...

  3. Mvc音乐商店demo的ajax异步删除功能总结

    刚刚从学校出来参加工作,没啥工作经验,所以各位大神们不要嘲笑哈! 来公司后要进行培训,给我们的作业中有一个使用 dapper+mvc+ajax+SQL Server 2008,来实现一个音乐商店的de ...

  4. 基于jQuery表格增加删除代码示例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. layui树形表格支持非异步和异步加载

    layui树形表格支持非异步和异步加载. 仓库地址:https://gitee.com/uniqid/ 使用示例如下: <div class="uui-admin-common-bod ...

  6. layui-table-column-select（layui数据表格可搜索下拉框select）

    layuiTableColumnSelect 在layui table的基础上对表格列进行扩展:点击单元格显示可搜索下拉列表. 码云地址:https://gitee.com/yangqianlong9 ...

  7. 基于layUI调用后台数据实现区域信息级联查询

    基于layUI调用后台数据实现区域信息级联查询 1.基本思路 后台提供根据区域编码查询区域列表公共接口 页面初始化调用后台接口加载所有省份 点击省份将省份区域编码传入后台查询该省份下所有地市信息,以此 ...

  8. 如何基于layui的laytpl实现数据绑定

    想了半天才想起自己园子的登录密码.可想而知,多长时间没登录了 正文一开始用layui做了几个管理系统,所以用起来觉得确实很容易上手,管理后台最常用的就是form和table以及弹窗类.layui提供的 ...

  9. 使用webapi绑定layui数据表格完整增删查改记录

    因为每次给layui数据表格绑定数据或者类似操作的时候  总要重新做一遍 而且忘记很多东西 所以干脆写博客把相关东西记录下来 便于查阅和修正 以下是一个完整的数据表格i项目的增删改查案例 先来看后台 ...

随机推荐

  1. GOLANG利用断言调用结构体内特有的方法-

    package main import( "fmt" _"sort" _"math/rand" ) //多态的特征是通过接口来实现的 //多 ...

  2. 04_ Flume采集文件到HDFS案例

    采集需求:比如业务系统使用log4j生成的日志,日志内容不断增加,需要把追加到日志文件中的数据实时采集到hdfs 根据需求,首先定义以下3大要素 采集源,即source——监控文件内容更新 :  ex ...

  3. 使用Tarjan进行缩点无向图

    int From[maxn],Laxt[maxn],To[maxn<<2],Next[maxn<<2],cnt; int low[maxn],dfn[maxn],times,q ...

  4. Python&Selenium 数据驱动【unittest+ddt+json】

    一.摘要 本博文将介绍Python和Selenium做自动化测试的时候,基于unittest框架,借助ddt模块使用json文件作为数据文件作为测试输入,最后生成html测试报告 二.json文件 [ ...

  5. hadoop关闭安全模式

    执行以下语句即可 hadoop dfsadmin -safemode leave

  6. PLSQL打开文件中文出现乱码

    假定数据库使用的是:American_America.AL32UTF8字符集. 查询方式:SELECT * FROM v$nls_parameters ; 查看NLS_CHARACTERSET 的值是 ...

  7. Can't connect to local MySQL server through socket '/var/run/mysqld/mysqld.sock'

    方法:重启MySQL 在命令行执行: /etc/init.d/mysql start

  8. 对JavaScript 模块化的深入-----------------引用

     什么是模块化 好的代码模块分割的内容一定是很合理的,便于你增加减少或者修改功能,同时又不会影响整个系统.  为什么要使用模块 1.可维护性:根据定义,每个模块都是独立的.良好设计的模块会尽量与外部的 ...

  9. java.util.Queue

    转载于:https://www.runoob.com/java/data-queue.html 队列是一种特殊的线性表,它只允许在表的前端进行删除操作,而在表的后端进行插入操作. LinkedList ...

  10. springboot热部署如果不行

    如果热部署不行先看一眼 Project——>Build Automatically 看这个有没有打对勾,这是热部署的依赖