AJAX 创建表格
<html>
<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:#309
} </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 创建表格的更多相关文章
- AJAX创建表格,删除数据
主页面 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8 ...
- Hive创建表格报【Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. MetaException】引发的血案
在成功启动Hive之后感慨这次终于没有出现Bug了,满怀信心地打了长长的创建表格的命令,结果现实再一次给了我一棒,报了以下的错误Error, return code 1 from org.apache ...
- 示例-创建表格-指定行列&删除表格的行和列
<body> <script type="text/javascript"> /* *上面的方法和你麻烦. *既然操作的是表格, *那么最方便的方式就是使用 ...
- 示例-创建表格&使用表格对象
@charset "utf-8";/* CSS Document */table{ border:#249bdb 1px solid; width:500px; border-co ...
- JavaScript创建表格的两种方式
方式一: var data = [ { id: 1, name: "first", age: 12 }, { id: 2, name: "second", ag ...
- 如何利用Dreamwever快速创建表格???
这样的一张表,用table写完感觉好累,很多单元格都不一样大,还要单独设置样式,今天还分享下用Dreamwever快速创建表格. 可能这会有人知道了!当然是插入表格了!
- [原创]Devexpress XtraReports 系列 2 创建表格报表
昨天发表了Devexpress XtraReports系列开篇,今天我们继续. 今天的主题是创建表格报表. 首先我们来看看最后实现的效果.Demo最后附上. 接下来开始讲解如何一步一步做出这个报表: ...
- 使用JS创建表格以及隔行换色(包括隔N行换色)
<html> <head> <title></title> <style> table{ width:800px; border-colla ...
- 今天学习了无序列表和有序列表和使用HTML5创建表格
ol建立有序列表,该列表可以用设置type="A/a" 其语法架构为 <ol> <li></li> <li></li> ...
随机推荐
- auDemo
Option Explicit Private Const MODULE_NAME = "auDemo.WSC" Dim oEccomOperation,dbDemo Set oE ...
- IE9 浏览器无法捕获中键事件
在silverlight中由于需要添加中键事件,所以通过hook来捕获,但是在IE9上无法运行,该问题是由于IE9设置问题,如下图修改配置, 取消选择即可:
- python的web开发环境Django配置
我的系统的windows10: 第一步,安装python3.5 第二步,配置django,如图所示,在python的安装目录下的Scripts里面执行:pip install Django,我这儿提示 ...
- percentiles of live data capture
For example, every ten seconds I got a server response time, I want to know the 90 percentile respon ...
- 基于PHP——简单的WSDL的创建(WSDL篇)
1.建立WSDL文件 建立WSDL的工具很多,eclipse.zendstudio.vs都可以,我个人建议自己写,熟悉结构,另外自动工具对xml schame类型支持在类型中可能会报错. 下 ...
- Ubuntu 忘记密码
1重启电脑Shift键进入GRUB引导模式如下图所示,选择第二行的recovery mode. 2 安e进入recovery mode 编译kernel进行启动参数 3 在linux /boot/vm ...
- C# DataTable转实体通用方法
public static class DataTableHelper { public static T GetEntity<T>(DataTable table) where T : ...
- diff命令
描述 在最简单的情况是, diff 比较两个文件的内容 (源文件 和 目标文件). 文件名可以是 - 由标准输入设备读入的文本. 作为特别的情况是, diff - - 比较一份标准输入的它自己的拷贝如 ...
- Servlet之保存用户偏好设置简单功能的实现
写在前面: 先来陈述一下为什么会有这样一个需求和这篇博文. 这是公司的一个项目,我们负责前端,后台服务由其他公司负责.该系统有一个系统偏好设置模块,用户可以设置系统的背景图片等系统样式,因为这是一个比 ...
- stm32 串口乱码的解决
版权声明:本文为博主原创文章. 前几天在中移物联网申请了一个迷你开发板,运行官方提供的程序,感觉板子是正常的.但是自己写的程序能够刷到板子上,但是串口却是乱码.官方和我的额程序都是用的库函数的方式写的 ...