AJAX创建表格,删除数据
主页面
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-2.1.1.min.js"></script>
<style type="text/css">
.sr
{
background-color:#0F0;
font-size:16px;
color:#C66
}
.sr:hover
{
background-color:#
} </style>
</head> <body>
<input type="button" id="btn" value="点击出现表格" style="width:100px"/>
<table border="1" cellpadding="0" cellspacing="0" width="100%" id="xianshi"> </table>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(e) {
Showall();
binkck(); });
<!--删除函数-->
function binkck()
{
$(".sr").click(function() {
var code = $(this).attr("bs");
$.ajax({
async:false,
url:"delete.php",
data:{code:code},
type:"POST",
dataType:"TEXT",
success: function(data)
{
if(data.trim()=="OK")
{
Showall();
binkck();
}
else
{
alert("失败");
} }
}) }); } <!--表格函数-->
//思路:把所有的数据做成字符语句,最后放入 html()输出
function Showall()
{
$.ajax({
async:false,
url:"chuli2.php",
dataType:"TEXT", //必须大写 dataType
success: function(data)
{
//把数据库的数据拼接,拿出来,然后拆分,最后组成字符语句,放入html()输出
var str="<tr><td>code</td><td>2</td><td>3</td></tr>";
//不要把表头放入table 表格,因为后面的$("#xianshi").html() 会覆盖掉
var hang=data.split("|");
for(var i=0;i<hang.length;i++)
{
str=str+"<tr>";
var lie =hang[i].split("^");
for(var j=0;j<lie.length;j++)
{
str=str+"<td>"+lie[j]+"</td>";
}
str+="<td class='sr' bs='"+lie[0]+"'>删除</td></tr>";
}
$("#xianshi").html(str); //输出
} })
} }); </script> </html>
chuli2.php
<?php
include("./Tp.class.php");
$db = new Tp(); $sql = "select * from nation"; $attr = $db->query($sql); $r="";
foreach($attr as $v)
{
$r=$r.implode("^",$v); //数组内,字符拼接
$r=$r."|"; //数组之间,用"|"拼接
} $str=substr($r,0,strlen($r)-1); //取字符串
echo $str; ?>
delete.php
<?PHP
//接受数据
$code = $_POST["code"];
//加载类
include("./Tp.class.php");
$db=new Tp();
$sql="delete from nation where Code='{$code}'";
$result = $db->query($sql,1);
//不要进行 $attr = $result 操作,这是一次数据输出操作,会录入data
if($result)
{
echo "OK";
}
else
{
echo "NO";
}
AJAX创建表格,删除数据的更多相关文章
- js动态创建表格,删除行列的小例子
js动态创建表格,删除行列的实例代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- Ajax:后台jquery实现ajax无刷新删除数据及demo
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA8gAAAFSCAIAAAChUmFZAAAgAElEQVR4nO29z4scWZbn2/+Hb30zi8
- SQL Server 创建 修改 删除数据表
1. 图形界面方式操作数据表 (1)创建和修改数据表 列名中如果有两个以上单词时,最好用下划线连接,否则可能会给将来的查询维护带来不便.我们公司美国佬做的数据库就很烦,所有列名都有空格,一旦忘记用方括 ...
- MySQL 创建和删除数据表
创建MySQL数据表需要以下信息: 表名 表字段名 定义每个表字段 语法 以下为创建MySQL数据表的SQL通用语法: CREATE TABLE table_name (column_name col ...
- AJAX 创建表格
<html><head> <meta http-equiv="Content-Type" content="text/html; chars ...
- Ajax请求数据与删除数据后刷新页面
1.ajax异步请求数据后填入模态框 请求数据的按钮(HTML) <a class="queryA" href="javascript:void(0)" ...
- mongodb系列~mongodb定时删除数据
一 简介:本文介绍创建自动删除数据的TTL索引 二 目的 定时删除数据三 创建方法 db.collection.createIndex(keys, options) options: ex ...
- mongodb定时删除数据(索引删除)
一 简介:本文介绍创建自动删除数据的TTL索引 二 目的 定时删除数据三 创建方法 db.collection.createIndex(keys, options) options: ex ...
- 数据库(概念、语法、DBMS、SQL语言:创建数据库、表格,添加、修改、删除数据记录)
关系型数据库:以表作为实体,以主键和外键关系作为联系的一种数据结构. 主键:在关系型数据库中,用一个唯一的标识符来标志每一行,这个标识符就是主键.主键有两个特点:非空和不能重复. 外键:在关系型数据库 ...
随机推荐
- Cordova开发总结(插件篇)
最近刚刚做完一个用Cordova开发了一款电子商务的应用.在选用Cordova前,我有考察过,国内的Appcan, Apicloud等等的解决方案.其实Appcan,ApiCloud的混合方案挺完整的 ...
- OSX 上安装 Scrapy 的那些坑
Scrapy 这个爬网框架真心不错,但在OSX上安装总是会出现各种的问题,在这里就作一个收集汇总.我的系统环境是 OS X El Capitan (10.11.1) 首先要保证 pip , virtu ...
- How to use VS2012 remote debug Windows Azure Cloud Services
Background: Windows Azure Cloud Services 可以在本地调试,使用Visual Studio 2012 + 模拟器 Emulator.但是模拟器的工作状态和环境和真 ...
- Quartz.Net在windows服务中的使用
写在前面 这几天在弄一个项目,需要定时抓取一些数据,当时也想直接用timer算了.因为之前也弄过这样的项目,但是一想,已经用过了,再去使用同一种思路,未免太乏味了.就换了一种新玩法.这里将之前看到的一 ...
- Js-字符转换数字
s 字符串转化成数字 的 三种方法主要有 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数, ...
- sql-and、or
WHERE 指令可以被用来由表格中有条件地选取资料. 这个条件可能是简单的 (像上一页的例子),也可能是复杂的.复杂条件是由二或多个简单条件透过 AND 或是 OR 的连接而成.一个 SQL 语句中可 ...
- 《疯狂Java:突破程序员基本功的16课》读书笔记-第二章 对象与内存控制
Java内存管理分为两个方面:内存分配和内存回收.这里的内存分配特指创建Java对象时JVM为该对象在堆内存中所分配的内存空间.内存回收指的是当该Java对象失去引用,变成垃圾时,JVM的垃圾回收机制 ...
- [Asp.net mvc] Asp.net mvc Kendo UI Grid的使用(四)
有段时间没写博客了,工作状态比较忙,抽空继续总结下Grid的使用,这次主要介绍模板以及其他官网介绍不详尽的使用方法.先Show出数据,然后讲解下.后台代码: public ActionResult O ...
- SSH配置文件和SSM配置文件的写法
一.SSH配置文件的写法(XML版本) <util:properties id="jdbc" location="classpath:db.properties&q ...
- com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Unknown database 'db_item'
一直很奇怪,为什么报错,进入mysql命令行,show databases:发现多谢了一个空格,如上图.