利用AJAX查询数据

<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>AJAX查询数据</title>

<script src="../jquery-1.11.2.min.js"></script>

</head>

<body>

<input type="button" value="显示数据" id="btn" />

<table id="xianshi" width="100%" cellpadding="0" cellspacing="0" border="1">

</table>

</body>

<script type="text/javascript">

$(document).ready(function(e) {

   $("#btn").click(function(){

		$.ajax({

			url:"chuli1.php",

			dataType:"TEXT",

			success: function(data){

				//alert(data);

				var str = "<tr><td>代号</td><td>姓名</td></tr>";

				var hang = data.split("|");

				for(var i=0;i<hang.length;i++)

				{

					var lie = hang[i].split("^");

					//str+="<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>删除</td></tr>";

					str+="<tr>";

					for(var j=0;j<lie.length;j++)

					{

						str+="<td>"+lie[j]+"</td>";

					}

					str+="</tr>"

				}

					$("#xianshi").html(str);

				}

			});

    })

});

</script>

</html>

　　处理页面：主要是讲二维数组装换成字符串的形式

<?php

include("../test0506/DBDA.class.php");

$db = new DBDA();

$sql = "select * from Nation";

$attr = $db->Query($sql);//返回一个二维数组

//将二维数组转换成字符串格式因为ajax返回的是text格式的

//echo "p001^汉族|p002^满族|p003^回族";//类似这种格式的才可以

$str = "";

foreach($attr as $v)

{

	//$str = implode("^",$v);//$v里面含有一条一条的数据，列与列之间的

	$str = $str.implode("^",$v);//否则等再次循环时会被替换

	$str = $str."|";

}

$str = substr($str,0,strlen($str)-1);//截取字符串的长度

echo $str;

　　显示效果：

利用AJAX删除数据，这个同之前不同的是不刷新页面-----处理页面同上

<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>AJAX查询数据</title>

<script src="../jquery-1.11.2.min.js"></script>

<style type="text/css">

.shan

{

	width:100px;

	height:30px;

	background-color:#30F;

	color:#FFF;

	text-align:center;

	line-height:30px;

	vertical-align:middle;

	font-size:20px;

}

.shan:hover

{

	background-color:#F63;

	cursor:pointer;

}

</style>

</head>

<body>

<input type="button" value="显示数据" id="btn" />

<table id="xianshi" width="100%" cellpadding="0" cellspacing="0" border="1">

</table>

</body>

<script type="text/javascript">

$(document).ready(function(e) {

	$("#btn").click(function(){

		ShowAll();

		BindCK();

		})

		function BindCK()

	{

		$(".shan").click(function(){

			var code = $(this).attr("bs");//获取主键值，有一个参数是获取

			$.ajax({

				url:"delete1.php",

				data:{code:code},

				dataType:"TEXT",

				type:"POST",

				success: function(data){

					if(data.trim()=="OK")//执行获取表格的内容部分

					{

						ShowAll();

						BindCK();

					}

					else

					{

						alert("删除失败");

					}

					}

				});

			})

	}

	function ShowAll()

  {

		$.ajax({

			async:false,//变为同步，删除时使用

			url:"chuli1.php",

			dataType:"TEXT",

			success: function(data){

				//alert(data);

				var str = "<tr><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><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>删除</td></tr>";

					str+="<tr>";

					for(var j=0;j<lie.length;j++)

					{

						str+="<td>"+lie[j]+"</td>";

					}

					str+="<td><div class='shan' bs='"+lie[0]+"'>删除<div></td>";	//自定义属性bs类似主键值				

					str+="</tr>"

				}

					$("#xianshi").html(str);

				}

			});

    }

});

</script>

</html>

　　显示效果：

附：将AJAX中二维数组转换成字符串，封装成类

<?php

class DBDA

{

	public $host = "localhost"; //服务器地址

	public $uid = "root"; //数据库的用户名

	public $pwd = ""; //数据库的密码

	//执行SQL语句，返回相应结果的函数

	//$sql是要执行的SQL语句

	//$type是SQL语句的类型，0代表增删改，1代表查询

	//$db代表要操作的数据库

	//Ajax调用返回字符串

	public function StrQuery($sql,$type=1,$db="mydb")

	{

		//造连接对象

		$conn = new MySQLi($this->host,$this->uid,$this->pwd,$db);

		//判断连接是否成功

		!mysqli_connect_error() or die("连接失败！");

		//执行SQL语句

		$result = $conn->query($sql);

		//判断SQL语句类型

		if($type==1)

		{

			$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

		{

			//如果是其他语句，返回true或false

			if($result)

			{

				return "OK";

			}

			else

			{

				return "NO";

			}

		}

	}

}

　　例题

<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

<?php

include("DBDA.php");

$db = new DBDA();

$sql = "select count(*) from Info where Code = 'p001'";

$str = $db->StrQuery($sql);

echo $str;

?>

</body>

</html>

　　结果是：1

5月17 利用AJAX查询数据库的更多相关文章

  1. 10月17日下午MySQl数据库CRUD高级查询

    高级查询:1.连接查询 #适用于有外键关系的  没有任何关系没法用select * from Info,Nation #同时查询这俩表并把两表每个数据相互组合,形成笛卡尔积 select * from ...

  2. Mybatis学习01：利用mybatis查询数据库

    通过mybatis来操作mysql数据库的步骤大致可分为以下几步: 在这里,我们以对下面这个这个表格进行操作为例: 表名:ssm 1 配置依赖 在pom.xml中添加所需要的的依赖 <!-- m ...

  3. 利用ajax获取网页表单数据，并存储到数据库之一（使用JDBC）

    所谓JDBC就是利用java与数据库相连接的技术,从数据库获取既有的信息或者把网页上的信息存储到数据库. 这里简单的介绍公司的一个小项目中的一部分,由于代码较多,所以用图片形式进行展示.源码请查看源码 ...

  4. 【DG】利用闪回数据库（flashback）修复Failover后的DG环境

    利用闪回数据库(flashback)修复Failover后的DG环境 1.1  BLOG文档结构图 1.2  前言部分 1.2.1  导读和注意事项 各位技术爱好者,看完本文后,你可以掌握如下的技能, ...

  5. [原创]java WEB学习笔记109：Spring学习---spring对JDBC的支持：使用 JdbcTemplate 查询数据库，简化 JDBC 模板查询，在 JDBC 模板中使用具名参数两种实现

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  6. 利用Ajax和JSON实现关于查找省市名称的二级联动功能

    功能实现的思路:我们经常碰见网上购物时候填写收件地址会用到这个查找省市县的三级联动查找功能,我们可以利用Ajax和JSON技术模拟这个功能,说白了同样是使用Ajax的局部数据更新功能这个特性.因为省市 ...

  7. 不得不看，只有专家才知道的17个SQL查询提速秘诀！

    不得不看,只有专家才知道的17个SQL查询提速秘诀! 原创 2018-01-23 布加迪编译 51CTO技术栈 “ 除非你遵循本文介绍的这些技巧,否则很容易编写出减慢查询速度或锁死数据库的数据库代码. ...

  8. Java 通过JDBC查询数据库表结构(字段名称,类型,长度等)

    Java 通过JDBC查询数据库表结构(字段名称,类型,长度等) 发布者:唛唛家的豆子   时间:2012-11-20 17:54:02   Java 通过JDBC查询数据库表结构(字段名称,类型,长 ...

  9. sql server 查询数据库所有的表名+字段

    SELECT * FROM INFORMATION_SCHEMA.columns WHERE TABLE_NAME='Account' SELECT    (case when a.colorder= ...

随机推荐

  1. Linux 时间矫正命令

    Linux 时间矫正 sudo ntpdate -u ntp.api.bz 第一使用可能提示ntpdate没安装,用以下命令安装即可 sudo apt install ntpdate

  2. 【.Net】在windows server 2016 和Windows10这些server上安装.net fw3.5

    一般就是打开server manager. 一直next到add feature 讲net3.5勾选 发现需要指定一个路径是什么 source\sxs之类的 下载microsoft-windows-n ...

  3. docker 命令2

    docker build -t dvm.adsplatformproxy:v1.0.0 . #build images docker run -e WWNamespace=dev -e ZKServe ...

  4. 如何在 sublime text 中以当前文件目录打开 cmd

    需求描述 sublime 固定可以自己设置和添加新的编译环境,比如在我们写 js 的时候可能会添加 node 来对 js 文件进行运行.但是,这样做的结果是,我们只能看到运行结果.有时候还希望能做些其 ...

  5. oracle 新建用户

    create user username identified by password; grant dba to username; 授权 或 grant connect, resource to ...

  6. Graphics for R

    https://cran.r-project.org/web/views/Graphics.html CRAN Task View: Graphic Displays & Dynamic Gr ...

  7. 转一个集成速锐的ss 回头试试 补充加速一、Vultr安装锐速

    https://liyuans.com/archives/ssr-serverspeeder-onekey.html Debian/Ubuntu 系统 ShadowsocksR 一键安装脚本 (集成锐 ...

  8. SpringBoot整合Servlet的两种方式

    SpringBoot整合Servlet有两种方式: 1.通过注解扫描完成Servlet组件的注册: 2.通过方法完成Servlet组件的注册: 现在简单记录一下两种方式的实现 1.通过注解扫描完成Se ...

  9. vue中eslintrc.js配置最详细介绍

    本文是对vue项目中自带文件eslintrc.js的内容解析, 介绍了各个eslint配置项的作用,以及为什么这样设置. 比较详细,看完能对eslint有较为全面的了解,基本解除对该文件的疑惑. /* ...

  10. Android Studio NDK开发-JNI调用Java方法

    相对于NDK来说SDK里面有更多API可以调用,有时候我们在做NDK开发的时候,需要在JNI直接Java中的方法和变量,比如callback,系统信息等.... 如何在JNI中调用Java方法呢?就需 ...