实现一个AJAX添加并显示数据的例子

控制器

<?php
namespace Home\Controller;
use Think\Controller;
class AjaxController extends Controller
{
public function test()
{
$this->display();
} public function xianshi()
{
$n = D("Nation");
$attr = $n->select(); $this->ajaxReturn($attr); //ajax返回方法 } public function tianjia()
{
$this->display();
} public function tianjiachuli()
{
$n = D("Nation");
$n->create();
$r = $n->add();
if($r)
{
$this->ajaxReturn("OK","eval");
}
else{
$this->ajaxReturn("NO","eval");
}
}
}

显示界面

<!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="__PUBLIC__/js/jquery-1.11.2.min.js"></script>
</head> <body>
<table id="aa" width="100%" border="1" cellpadding="0" cellspacing="0"> </table>
<a href="__CONTROLLER__/tianjia">添加</a>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$.ajax({
url:"__CONTROLLER__/xianshi",
data:{},
type:"POST",
dataType:"JSON",
success: function(data){
var aa = "<tr><td>代号</td><td>名称</td><td>修改</td><td>删除</td></tr>";
var str = "";
for(a in data)
{
str = str+"<tr><td>"+data[a].code+"</td><td>"+data[a].name+"</td><td><a href='__CONTROLLER__/xiugai/code/"+data[a].code+"'>修改</a></td><td><a href='__CONTROLLER__/shanchu/code/"+data[a].code+"'>删除</a></td>";
}
$("#aa").html(aa+str);
}
})
});
</script>
</html>

添加页面

<!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="__PUBLIC__/js/jquery-1.11.2.min.js"></script>
</head> <body> <div>代号:<input type="text" id="code" /></div>
<div>名称:<input type="text" id="name" /></div>
<div><input type="button" id="btn" value="添加" /></div> <script type="text/javascript"> $("#btn").click(function(){
var code = $("#code").val();
var name = $("#name").val();
$.ajax({
url:"__CONTROLLER__/tianjiachuli",
data:{Code:code,Name:name},
dataType:"TEXT",
type:"POST",
success:function(data){
if(data=="OK")
{
window.location.href="__CONTROLLER__/test";
}
else
{
alert("添加失败");
}
}
});
}) </script>
</body>
</html>

tp框架之AJAX的更多相关文章

  1. tp框架实现ajax

    不墨迹,直接进主题. tp框架实现ajax 首先,我们先做一个testajax.html用来显示页面(只是一个简单的下拉列表^_^) <!DOCTYPE html PUBLIC "-/ ...

  2. TP框架中ajax post请求时提示404

    ajax post请求时提示404错误 TP框架中ajax post请求时提示404 找了半天是 控制器中方法有错误! 下次再遇到去控制器方法中找一步一步找,肯定能找到,我是单词拼错了!

  3. tp框架 使用ajax

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

  4. tp框架实现ajax注册验证

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. tp框架 php ajax 登陆

    html 文件 <form class="form-signin loginform" role="form"> <input type=&q ...

  6. TP框架ajax U方法不解析怎么办?

    TP框架中ajax U方法不解析 ajax U方法不解析 ajax url不解析 问题: 造成问题原因: Js 存在单独的 js文件中和html分离了.造成不解析! 解决方法: 方法一:将js放到ht ...

  7. tp框架验证信息

    今天在这里我们学习一下tp框架里面怎么做验证. 验证又分为两种:静态验证.动态验证 首先,我们还是先做一个html界面,名为add.html.代码如下: <!DOCTYPE html PUBLI ...

  8. tp框架表单验证 及ajax

    之前的表单验证都是用js写的,这里也可以使用tp框架的验证.但是两者比较而言还是js验证比较好,因为tp框架验证会运行后台代码,这样运行速度和效率就会下降. 自动验证是ThinkPHP模型层提供的一种 ...

  9. TP框架如何绑定参数。目的进行ajax验证

    TP框架的自动绑定 对于某些操作的情况(例如模型的写入和更新方法),可以支持参数的自动绑定,例如: 首先需要开启DB_BIND_PARAM配置参数: 'DB_BIND_PARAM' => tru ...

随机推荐

  1. UML大战需求分析--阅读笔记01

    本次阅读的书籍是<UML大战需求分析>,看了前两章的内容:1 大话UML,2绞尽脑汁的需求分析.这两章内容关联不大,分开描述. 第一章:大话UML 本章主要概述UML是什么,有什么内容.U ...

  2. adobe premiere pro cc2015.0已停止工作 解决办法

    adobe premiere pro cc2015.0已停止工作 一直报错 解决办法就是: 删除我的电脑  我的饿文档下的 Adobe下的Premiere Pro文件夹 现象就是怎么重新安装都不管用P ...

  3. maven阿里云中央仓库

    配置 修改maven根目录下的conf文件夹中的setting.xml文件,内容如下: <mirrors> <mirror> <id>alimaven</id ...

  4. Jquery 插件\Js 插件收集

    1.linq.js 使得js 的数组像c#的linq操作一下样 http://linqjs.codeplex.com/ 2.分页插件 https://github.com/mricle/Mricode ...

  5. R自动数据收集第一章概述——《List of World Heritage in Danger》

      导包     library(stringr) library(XML) library(maps) heritage_parsed <- htmlParse("http://en ...

  6. Android 项目结构图

    src:存放Java源代码 gen:存放系统自动生成的配置文件 Android 4.4.2:包含Android.jar文件,包含构建应用程序所需的所有Android SDK库 asssets:存放资源 ...

  7. poj Flip Game 1753 (枚举)

    Flip Game Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 27005   Accepted: 11694 Descr ...

  8. UVA - 11235 Frequent values

    2007/2008 ACM International Collegiate Programming Contest University of Ulm Local Contest Problem F ...

  9. ubuntu

    mongoChef: http://3t.io/mongochef/download/core/platform/#tab-id-3 背景色改成豆沙绿: /usr/share/themes/Ambia ...

  10. input事件与change事件

    输入框的change事件: 必须等到输入框失去焦点的时候才会触发,鼠标在空白的地方点一下: 输入框的input事件: 在输入内容变化的同时,实时的触发,不需要等到失去焦点.