<!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对数据进行查看人员信息的更多相关文章

  1. ajax Post数据，并得到返回结果，密码加密（Select，checkbox）

    使用ajax Post数据到后台Server,并从后台返回数据给前端WEB: urls.py: from django.conf.urls import url from aptest import ...

  2. pandas_查看数据特征和统计信息

    # 查看数据特征和统计信息 import pandas as pd # 读取文件 dataframe = pd.read_excel(r'C:\Users\lenovo\Desktop\总结\Pyth ...

  3. thinkphp+datatables+ajax 大量数据服务器端查询

    今天一白天全耗在这个问题上了,知乎2小时除外... 现在19:28分,记下来以备后查. 问题描述:从后台数据库查询人员信息,1w多条,使用一个好看的基于bootstrap的模板 Bootstrap-A ...

  4. Liunx下查看服务器硬件信息

    一.如何查看服务器的CPU 今天安装了9台Linux服务器,型号完全不一样(有DELL. HP和IBM服务器),又懒得去对清单,如何在Linux下cpu的个数和核数呢?另外,nginx的cpu工作模式 ...

  5. vue ajax获取数据的时候，如何保证传递参数的安全或者说如何保护api的安全

    https://segmentfault.com/q/1010000005618139 vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全 点击提交,发送请求.但是api ...

  6. 渐进式web应用开发---ajax本地数据存储(四)

    在前几篇文章中,我们使用service worker一步步优化了我们的页面,现在我们学习使用我们之前的indexedDB, 来缓存我们的ajax请求,第一次访问页面的时候,我们请求ajax,当我们继续 ...

  7. 渐进式web应用开发---使用indexedDB实现ajax本地数据存储(四)

    在前几篇文章中,我们使用service worker一步步优化了我们的页面,现在我们学习使用我们之前的indexedDB, 来缓存我们的ajax请求,第一次访问页面的时候,我们请求ajax,当我们继续 ...

  8. 扩展auth_user字段、BBS需求分析、创建BBS数据库、注册页面搭建与用户头像展示及Ajax提交数据

    昨日内容回顾 csrf跨站请求 1. SQL注入 2. xss攻击 3. csrf跨站请求 4. 密码加密(加盐) '''django中默认有一个中间件来验证csrf''' # 只针对post请求才验 ...

  9. Sql Server之使用T_SQL创建，修改，查看数据库信息

    一.使用Transact_SQL创建数据库 Transact_SQL语法如下:  create database database_name   [ on     [primary]  [<fi ...

随机推荐

  1. 安卓CTS官方文档之兼容性测试套件简介-attach

    官方英文文档原文:https://source.android.com/compatibility/cts-intro.html Compatibility Test Suite  兼容性测试套件 H ...

  2. Unity3D开发必备神器（Visual Studio Tools for Unity）

    Unity3D开发必备神器(Visual Studio Tools for Unity) 开发Unity3D程序你用的什么IDE呢? 1.MonoDevelop 2.VS 可能你的回答是这样的,我用的 ...

  3. python进程池剖析（三）

    之前文章对python中进程池的原理.数据流以及应用从代码角度做了简单的剖析,现在让我们回头看看标准库中对进程池的实现都有哪些值得我们学习的地方.我们知道,进程池内部由多个线程互相协作,向客户端提供可 ...

  4. Linux环境下搭建php开发环境的操作步骤

    本文主要记载了通过编译方式进行软件/开发环境的安装过程,其他安装方式忽略! 文章背景: 因为php和Apache等采用编译安装方式进行安装,然而编译安装方式,需要c,c++编译环境, 通过apt方式安 ...

  5. 站点维护使用app_offline.htm页面提供友好的更新提示

    进行站点维护时为了以一个友好的方式提示给用户,比如什么“本网站正在更新”等等的信息可以建立一个叫app_offline.htm 的静态HTM页面文件,其中修改成你要临时显示的内容,将其放在你的应用的根 ...

  6. bootstrap悬浮顶部或者底部

    这是bootstrap提供的样式,只需要引入bootstrap.css即可. 需要使用的class样式: navbar navbar-inverse navbar-inner navbar-fixed ...

  7. Vijos: P1046观光旅游

    背景 湖南师大附中成为百年名校之后,每年要接待大批的游客前来参观.学校认为大力发展旅游业,可以带来一笔可观的收入. 描述 学校里面有N个景点.两个景点之间可能直接有道路相连,用Dist[I,J]表示它 ...

  8. 二分法-C++

    对于一个非线性方程f(x)=0求改方程的根,我们的思路可以这么想: 1.根的存在性.若该方程没有根,何必徒劳想法设法去求它的解呢?对于一个方程,我们怎么去找他的根,有连续函数零点定理可知:若有f(a) ...

  9. Asp.Net中使用Couchbase——Memcached缓存使用篇

    Asp.Net中使用Couchbase——Memcached缓存使用篇 前言 在上一篇Asp.Net中使用Couchbase——Memcached缓存入门篇http://www.cnblogs.com ...

  10. 利用MARQUEE实现正在处理效果

    ASP.NET服务器端事件利用MARQUEE实现正在处理效果   前言:ASP.NET同仁们应该都遇到过当触发一个比较耗时的服务器端事件时,页面会处在一个等待的状态(即假死状态),用户体验非常不好,很 ...