用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>无标题文档</title>

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

<script src="bootstrap.min.js"></script>

<link href="bootstrap.min.css" rel="stylesheet" type="text/css" />

</head>

<body>

<h1>显示数据</h1>

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

	<tr>

    	<td>代号</td>

        <td>姓名</td>

        <td>性别</td>

        <td>民族</td>

        <td>生日</td>

        <td>操作</td>

    </tr>

    <tbody id="bg">

    </tbody>

</table>

<!-- 模态框（Modal） -->

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

    <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>

                <h4 class="modal-title" id="myModalLabel">详细信息</h4>

            </div>

            <div class="modal-body" id="content"></div>

            <div class="modal-footer">

                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

            </div>

        </div><!-- /.modal-content -->

    </div><!-- /.modal -->

</div>

</body>

<script type="text/javascript">

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

 	jiazai();

});

//加载数据的方法

function jiazai()

{

	//异步

	$.ajax({

			url:"123123.php",

			dataType:"TEXT",

			success: function(data){

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

					var str = "";

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

					{

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

						str += "<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[4]+"</td><td><input type='button' value='详情' class='xiangqing' code='"+lie[0]+"' data-toggle='modal' data-target='#myModal' /></td></tr>";

					}

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

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

						var code = $(this).attr("code");

						$.ajax({

								url:"123124.php",

								data:{code:code},

								type:"POST",

								dataType:"TEXT",

								success: function(d){

										var lie = d.split("^");

										var c = "<div>代号："+lie[0]+"</div><div>姓名："+lie[1]+"</div><div>性别："+lie[2]+"</div><div>民族："+lie[3]+"</div><div>生日："+lie[4]+"</div>";

										$("#content").html(c);

									}

							});

					})

				}

		});

}

</script>

</html>

分页面：123123.PHP

把要显示的代号字母转换成汉字显示出来

<?php

include("DBDA.class.php");

$db = new DBDA();

$sql = "select * from info";

$attr = $db->Query($sql);

for($i=0;$i<count($attr);$i++)

{

	$attr[$i][2]=$attr[$i][2]?"男":"女";

	$sqll = " select name from nation where code = '{$attr[$i][3]}' ";

	$de = $db->Query($sqll);

	$attr[$i][3] = $de[0][0];

}

// n001^汉族|n002^回族

$str = "";

foreach($attr as $v)

{

	$str .=implode("^",$v)."|";

}

//echo $str;

echo substr($str,0,strlen($str)-1);

分页面：123124.php

?php
include("DBDA.class.php");
$db = new DBDA();

$code = $_POST["code"];
$sql = "select * from info where code='{$code}'";

$attr = $db->Query($sql);

$attr[0][2]=$attr[0][2]?"男":"女";
   $sqll = " select name from nation where code = '{$attr[0][3]}' ";
   $de = $db->Query($sqll);
   $attr[0][3] = $de[0][0];
   $str = "";
           foreach($attr as $v)
           {
               $str .= implode("^",$v)."|";
           }

           echo substr($str,0,strlen($str)-1);

下面是运行结果

用ajax对数据进行查看人员信息的更多相关文章

ajax Post数据，并得到返回结果，密码加密（Select，checkbox）
使用ajax Post数据到后台Server,并从后台返回数据给前端WEB: urls.py: from django.conf.urls import url from aptest import ...
pandas_查看数据特征和统计信息
# 查看数据特征和统计信息 import pandas as pd # 读取文件 dataframe = pd.read_excel(r'C:\Users\lenovo\Desktop\总结\Pyth ...
thinkphp+datatables+ajax 大量数据服务器端查询
今天一白天全耗在这个问题上了,知乎2小时除外... 现在19:28分,记下来以备后查. 问题描述:从后台数据库查询人员信息,1w多条,使用一个好看的基于bootstrap的模板 Bootstrap-A ...
Liunx下查看服务器硬件信息
一.如何查看服务器的CPU 今天安装了9台Linux服务器,型号完全不一样(有DELL. HP和IBM服务器),又懒得去对清单,如何在Linux下cpu的个数和核数呢?另外,nginx的cpu工作模式 ...
vue ajax获取数据的时候，如何保证传递参数的安全或者说如何保护api的安全
https://segmentfault.com/q/1010000005618139 vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全点击提交,发送请求.但是api ...
渐进式web应用开发---ajax本地数据存储(四)
在前几篇文章中,我们使用service worker一步步优化了我们的页面,现在我们学习使用我们之前的indexedDB, 来缓存我们的ajax请求,第一次访问页面的时候,我们请求ajax,当我们继续 ...
渐进式web应用开发---使用indexedDB实现ajax本地数据存储(四)
在前几篇文章中,我们使用service worker一步步优化了我们的页面,现在我们学习使用我们之前的indexedDB, 来缓存我们的ajax请求,第一次访问页面的时候,我们请求ajax,当我们继续 ...
扩展auth_user字段、BBS需求分析、创建BBS数据库、注册页面搭建与用户头像展示及Ajax提交数据
昨日内容回顾 csrf跨站请求 1. SQL注入 2. xss攻击 3. csrf跨站请求 4. 密码加密(加盐) '''django中默认有一个中间件来验证csrf''' # 只针对post请求才验 ...
Sql Server之使用T_SQL创建，修改，查看数据库信息
一.使用Transact_SQL创建数据库 Transact_SQL语法如下: create database database_name [ on [primary] [<fi ...

随机推荐

CentOS 7 结构体GCC 4.8.2 32位编译环境
centos 7 结构体gcc 32位编译环境 1介绍 1.1背景学习新 C++ 2011和C11标准. 1.2使用软件 CentOS 7(Linux version 3.10.0-123.el7. ...
SQL Server 性能调优之运行计划（Execution Plan）调优
运行计划中的三种 Join 策略 SQL Server 存在三种 Join 策略:Hash Join,Merge Join,Nested Loop Join. Hash Join:用来处理没有排过序/ ...
使用 Visual C# .NET 生成 Office COM 外接程序
Microsoft Office XP 和 Microsoft Office 2003 都支持一种新的统一的设计结构,这种结构用于生成应用程序外接程序以增强和控制 Office 应用程序.这些外接程序 ...
js 计算过去和未来的时间距离现在多少天？
计算传入的任意一时间.计算出这个时间距离现在还有多少天!或者计算过去的时间距离现在已经过去了多少天! 返回值有两种! 1.负值代表过去了多少天 2.正值代表距离设定的时间还有多少天说明:距离设定 ...
Scala 的 Web 框架 Lift 开始 3.0 版本开发
Scala 的 Web 框架 Lift 开始 3.0 版本开发 http://demo.liftweb.net/ http://liftweb.net/download Lift 框架在不断的成长和改 ...
1951: [Sdoi2010]古文字猪
1951: [Sdoi2010]古代猪文链接:Click Here~ 题目: 一道非常好的组合数学题.!!.题目非常长.只是就以下几段话实用. iPig认为仅仅要符合文献,每一种能整除N的k都是有可 ...
eclipse在使用git
一些eclipse已经自带GIt该,不要安装. 假设,再想想安装.能够卸载GIT,卸载不同eclipse卸载是不一样的: 1.在Eclipse中依次点击菜单"Help"-> ...
PhotoShop基本工具 -- 移动工具
艺术或学习的东西吧, 爱好比学编程还难 PS版本号 : PhotoShop CS6 1. 移动工具 (1) 工具栏和属性栏工具栏和属性栏 : 左側的是工具栏, 每选中一个工具, 在菜单条的 ...
QueryOver<T>
NHibernate 数据查询之QueryOver<T> 一.限制运算符 Where:筛选序列中的项目WhereNot:反筛选序列中的项目二.投影运算符 Select:创建部分序列的 ...
使用POI 导入excel
引言:最近一直在接触excel的问题,网页也有很多关于POI解析excel的资料,我也简单的整理了下,有不对地方的还望及时指正,渴望与大家交流并学习. public int importExcel(F ...

用ajax对数据进行查看人员信息

用ajax对数据进行查看人员信息的更多相关文章

随机推荐

热门专题