ajax中网页传输(一)TEXT——带有删除功能的数据库表格显示练习
网页之间传输的三种方式:TEXT、JSON、XML。
本章将讲解带有TEXT形势的ajax网页传输

第一:body部分代码
<title>ajax中TEXT讲解并且带有删除功能的表格</title>
<script src="jquery-2.0.0.min.js"></script>
<style type="text/css">
.sc
{
width:70px;
height:30px;
background-color:#3FF;
color:#F00;
text-align:center;
line-height:30px;
vertical-align:middle;
font-size:20px;
}
.sc:hover
{
cursor:pointer;
background-color:#096;
}
</style>
</head> <body>
<input type="button" value="显示数据" id="btn"/>
<table id="xianshi" width="100%" border="1" cellpadding="0" cellspacing="0"> </table>
</body>
第二:点击“显示数据”需要用到的chuli.php代码
<?php
include("DBDA.class.php");
$db=new DBDA(); $sql="select * from info"; //自己写语句
/*$attr=$db->Query($sql); $str="";
foreach($attr as $v)
{
$str=$str.implode("^",$v);
$str=$str."|";
} $str=substr($str,0,strlen($str)-1); //截取最后的“|”*/ //调用封装类里面的函数
$re=$db->StrQuery($sql); echo $re;
AJAX调用返回字符串所引用的StrQuery()函数
//AJAX调用返回字符串
function StrQuery($sql,$type=0,$ku="mydb")
{
$db=new MySQLi($this->host,$this->uid,$this->pwd,$ku); !mysqli_connect_error() or die ("连接失败"); $result=$db->query($sql); //当为查询语句时
if($type==0)
{
$attr=$result->fetch_all();
$str=""; for($i=0;$i<count($attr);$i++)
{
for($j=0;$j<count($attr[$i]);$j++)
{
$str=$str.$attr[$i][$j];
$str=$str."^";
}
$str=substr($str,0,strlen($str)-1);
$str=$str."|";
}
$str=substr($str,0,strlen($str)-1); return $str;
}
//增删改语句
else
{
if($result)
{
return "OK";
}
else
{
return "NO";
}
}
}
第三:JScript中运行的“显示数据”用到的js代码函数
function Showall()
{
$.ajax({ async:false,
url:"chuli02.php",
dataType:"TEXT",
success: function(data){ var str="<tr align='center'><td>代号</td><td>姓名</td><td>性别</td><td>民族</td><td>生日</td><td>操作</td><tr>"; var hang=data.split("|"); //以“|”截取 for(var i=0;i<hang.length;i++){ var lie=hang[i].split("^"); //str+="<tr align='center'><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[4]+"</td><td><div class='sc' bs='"+lie[0]+"'>删除</div></td></tr>"; str+="<tr align='center'>"; for(var j=0;j<lie.length;j++)
{
str+="<td>"+lie[j]+"</td>";
} str+="<td><div class='sc' bs='"+lie[0]+"'>删除</div></td>"; str+="</tr>";
} $("#xianshi").html(str);
}
})
第四:表格中点击“删除”后台运行的代码delete.php
<?php
$code=$_POST["code"];
include("DBDA.class.php");
$db=new DBDA(); $sql="delete from info where code='{$code}'"; $r=$db->Query($sql,1); //1代表增删改,默认0代表查询
if($r)
{
echo "OK";
}
else
{
echo "NO";
}
第五:JScript中“删除”用到的js函数代码
function BindCK(){
$(".sc").click(function(){
var code=$(this).attr("bs");
$.ajax({
url:"delete03.php",
data:{code:code},
type:"POST",
dataType:"TEXT",
success:function(data){
if(data=="OK"){
Showall();
BindCK();
}
else{
alert("删除失败!");
}
}
})
})
}
第六:JScript中两个函数代码整合在一起的调用的代码
$("#btn").click(function(){
Showall();
BindCK();
})
ajax中网页传输(一)TEXT——带有删除功能的数据库表格显示练习的更多相关文章
- ajax中网页传输(三)XML——下拉列表显示练习
XML:页面之间传递数据,跨平台传递 HTML:超文本标记语言,核心标签 XML的形势为 <xml version='1.0'> <Nation> <one> &l ...
- ajax中网页传输(二)JSON——下拉列表显示练习
以json返回数据类型显示“民族下拉列表” 第一:body页面显示部分 <title>JSON下拉显示Nation表中的数据</title> <script src=&q ...
- jqGrid添加删除功能(不和数据库交互)
jqGrid添加删除功能(不和数据库交互) 一.背景需求 项目中需要在前端页面动态的添加行,删除行,上下移动行等,同时还不和数据库交互.一直在用jqGrid展示表格的我们,从没有深入的研究过它,当然看 ...
- AJAX中的dataType(数据格式)-text、json
因为经常使用数据格式,所以将它封装成类,J这样就不会用到时就写了,直接调用写好的类就可以了 (1)dataType数据格式为:TEXT格式的数据是字符串的数据,在"ajax对数据进行删除和查 ...
- Ajax中的JSON格式与php传输过程的浅析
在Ajax中的JSON格式与php传输过程中有哪些要注意的小地方呢? 先来看一下简单通用的JSON与php传输数据的代码 HTML文件: <input type="button&quo ...
- ajax“显示弹窗详情”和“删除”功能练习
1.查看详细信息,以弹窗的形式显示,使用ajax 2.批量删除 “查询”功能可以参考前面的文章,这里只讲解ajax“显示弹窗详情”和“删除”功能 第一:在body中的代码 <title>a ...
- 使用HTML5中postMessage实现Ajax中的POST跨域问题
HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...
- AJAX 中Sys.WebForms.PageRequestManager的事件激发顺序 《转》
AJAX 中Sys.WebForms.PageRequestManager的事件激发顺序 测试代码: 测试代码如下: <%@ Page Language="C#" AutoE ...
- Mvc音乐商店demo的ajax异步删除功能总结
刚刚从学校出来参加工作,没啥工作经验,所以各位大神们不要嘲笑哈! 来公司后要进行培训,给我们的作业中有一个使用 dapper+mvc+ajax+SQL Server 2008,来实现一个音乐商店的de ...
随机推荐
- CSS之position
1.当元素使用了position:relative或者position:absolute才能激活 top left 等属性的使用! 2.使用了position后,display无论设置了什么值都会 ...
- 编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时会产生Additional information: 阅读器关闭时尝试调用 Read 无效问题,解决方法与解释
在自学杨中科老师的视频教学时,拓展编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时 会产生Additional information: 阅读器关闭时尝试调用 ...
- Fiddler-008-简单模拟性能测试
通过 Fiddler 可以简单的模拟性能测试的并发测试,此方法非常的简单,直接讲述如何使用,敬请参阅! 首先我们要获取需要并发的 HTTP请求,此操作非常简单,则在此不再赘述.获取到响应的 HTTP请 ...
- 我的第一个WCF程序,很简单适合我等菜鸟
1.首先我罗列一下网站搜索并经过自己理解的WCF的含义: 1)WCF:(WIndows Communication Foundation)是由微软是由微软发展的一组数据通信的应用开发接口,可以翻译为W ...
- windows下memcache安装及配置
1.安装memcached服务,链接为http://i.cnblogs.com/Files.aspx, 下载解压后放在一个文件夹下,在开始搜索中输入cmd, 进入cmd黑框,cd 路径,进入memca ...
- MFC之常用控件(四)
常用控件主要包括:静态文本框.编辑框.单选按钮.复选框.分组框.列表框.组合框.图片控件.列表控件.树形控件和进度条控件等等.本节教程先来讲解静态文本框的使用. 控件的通知消息 在将静态文本框的使用之 ...
- linux matlab2013b 安装教程
链接:http://pan.baidu.com/s/1pJE6R2b 密码:shfy 1. 解压缩“Mathworks Matlab R2013b Linux.rar”(无需密码),得到“Mathwo ...
- iOS: 悬浮的条件筛选框使用二
一.介绍: 在前面已经介绍了一种条件悬浮框,使用的是tableView的Plain分组样式实现的,因为这是tableView本身就具备的功能,分组悬浮效果.这次我来介绍第二种更加简单的方法,采用两个S ...
- ionic环境搭建和安装
1. 安装node环境 nodeJs环境的安装很简单,去官网下载最新版的NodeJs直接安装即可. Node官网: https://nodejs.org/ 安装完成后配置环境变量,计算机->属性 ...
- DNSPod各个套餐的DNS地址
DNSPod各个套餐的DNS地址 https://support.dnspod.cn/Kb/showarticle/tsid/178/ DNSPod各个套餐的DNS地址每种域名套餐对应的DNS地址是不 ...