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. ACM中值得注意/利用的C++语法特性

    C++ 的易踩坑点 随时补充 STL不能边循环边erase() //自己写的求交集RE了 for (set <int> ::iterator it = s.begin(); it != s ...

  2. Linux gdb调试及后台程序问题

    https://blog.csdn.net/lengchanguo/article/details/50481533 转? 问题是后台& 调试

  3. js技术javascript 该重视

    当下,js大有挤压php java asp.net之类后端语言的趋势,直接js html5 socket与后端python c c++ 等通信 更不用提二维 三维计算展示 方面 医院呼叫 报警  处理 ...

  4. C#实现异步阻塞TCP（SocketAsyncEventArgs，SendAsync，ReceiveAsync，AcceptAsync，ConnectAsync）

    1.类 (1)socket IO操作内存管理类 BufferManager // This class creates a single large buffer which can be divid ...

  5. 关于IO的同步,异步,阻塞,非阻塞

    上次写了一篇文章:Unix IO 模型学习.恰巧在这次周会的时候,@fp1203 (goldendoc成员之一) 正好在讲解poll和epoll的底层实现.中途正好讨论了网络IO的同步.异步.阻塞.非 ...

  6. P2709 小B的询问——普通莫队&&模板

    普通莫队概念 莫队:莫涛队长发明的算法,尊称莫队.其实就是优化的暴力. 普通莫队只兹磁询问不支持修改,是离线的. 莫队的基本思想:就是假定我得到了一个询问区间[l,r]的答案,那么我可以在极短(通常是 ...

  7. siblings([expr])

    siblings([expr]) 概述 取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合.可以用可选的表达式进行筛选.大理石平台维修   参数 exprStringV1.0 用于筛选 ...

  8. scrollTop([val])

    scrollTop([val]) 概述 获取匹配元素相对滚动条顶部的偏移.广州大理石机械构件 此方法对可见和隐藏元素均有效. 参数 valString, NumberV1.2.6 设定垂直滚动条值 示 ...

  9. PC打开AS400 folder

    1.首先确保在iSeriers能打开该folder  Wrklink 'QDLS'  如果出现如下错误,则需要增加user profile到Directory Entries list CPF9006 ...

  10. HDU 5863 cjj's string game ( 16年多校10 G 题、矩阵快速幂优化线性递推DP )

    题目链接 题意 : 有种不同的字符,每种字符有无限个,要求用这k种字符构造两个长度为n的字符串a和b,使得a串和b串的最长公共部分长度恰为m,问方案数 分析 : 直觉是DP 不过当时看到 n 很大.但 ...