thinkphp中怎么用ajax
thinkphp中使用ajax很简单.主要掌握的地方有三个.
第一.tp中ajax的url需要使用大U方法.比如:$.post("{:U('User/add')}")
第二.控制器中返回结果得第一种方法.$this->error('失败','',true); 第三个参数为true.则发挥的是json数据.包含info.status.url三项.
第三.控制器中返回结果的第二种方法.$this->ajaxReturn(array('customKey1'=>'customValue1','customKey2'=>'customValue2','customKey3'=>'customValue3')).
掌握以上三点和ajax基本使用方法.那么在tp中使用ajax也就掌握了.简单的例子如下.伪代码,或许有错.
模板中:
<script>
$.post("{:U('User/add')",{uname:xiaoming,age:15},function(data){
//data接收返回数据
if(data.status == 1){
alert(data.info);
location.href = data.url;
}else{
alert('错误');
}
});
</script>
控制器中:
public function add(){
if(IS_AJAX){
$name = I('post.name','','trim');
$age = I('post.age','','trim');
if($name && $age){
//插入数据
$this->success('添加成功',U('User/index'),true);
}else{
$this->ajaxReturn(array(
'status' => 0,
'info' => '大爷,您没输入名字',
'url' => U('User/add')
));
}
}else{
return false;
}
}大概就是这样子.至于剩下的$.ajax.$.getJson等等都是一样的道理
第一.tp中ajax的url需要使用大U方法.比如:$.post("{:U('User/add')}")
第二.控制器中返回结果得第一种方法.$this->error('失败','',true); 第三个参数为true.则发挥的是json数据.包含info.status.url三项.
第三.控制器中返回结果的第二种方法.$this->ajaxReturn(array('customKey1'=>'customValue1','customKey2'=>'customValue2','customKey3'=>'customValue3')).
简介：
国内翻译常为“阿贾克斯”和阿贾克斯足球队同音。Web应用的交互如Flickr,Backpack和Google在这方面已经有质的飞跃。这个术语源自描述从基于Web的应用到基于数据的应用的转换。在基于数据的应用中，用户需求的数据如联系人列表，可以从独立于实际网页的服务端取得并且可以被动态地写入网页中，给缓慢的Web应用体验着色使之像桌面应用一样。
开发模式：
许多重要的技术和AJAX开发模式可以从现有的知识中获取。例如，在一个发送请求到服务端的应用中，必须包含请求顺序、优先级、超时响应、错误处理及回调，其中许多元素已经在Web服务中包含了，就像现在的SOA。AJAX开发人员拥有一个完整的系统架构知识。同时，随着技术的成熟还会有许多地方需要改进，特别是UI部分的易用性。
AJAX开发与传统的CS开发有很大的不同。这些不同引入了新的编程问题，最大的问题在于易用性。由于AJAX依赖浏览器的JavaScript和XML，浏览器的兼容性和支持的标准也变得和JavaScript的运行时性能一样重要了。这些问题中的大部分来源于浏览器、服务器和技术的组合，因此必须理解如何才能最好的使用这些技术。
综合各种变化的技术和强耦合的客户服务端环境，AJAX提出了一种新的开发方式。AJAX开发人员必须理解传统的MVC架构，这限制了应用层次之间的边界。同时，开发人员还需要考虑CS环境的外部和使用AJAX技术来重定型MVC边界。最重要的是，AJAX开发人员必须禁止以页面集合的方式来考虑Web应用而需要将其认为是单个页面。一旦UI设计与服务架构之间的范围被严格区分开来后，开发人员就需要更新和变化的技术集合了。
MessageAction.class.php
<?php
class MessageAction extends Action{
function
index(){
$this->display();
}
function
add(){
//ajaxReturn(数据,'提示信息',状态)
$m=M('message');
if($m->add($_GET)){
$this->ajaxReturn($_GET,'添加信息成功',1);
}else{
$this->ajaxReturn(0,'添加信息失败',0);
}
}
}
?>
模板index.html
<html>
<head>
<script type="text/javascript"
src="__PUBLIC__/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(function(){
$('input:button').click(function(){
var
$title=$('input[name="title"]').val();
var
$message=$('input[name="message"]').val();
$mess=$('#mess');
$.getJSON('__URL__/add',{title:$title,message:$message},function(json){
//alert(json);return false;
if(json.status==1){
$mess.slideDown(3000,function(){
$mess.css('display','block');
}).html('标题为'+json.data.title+'信息为'+json.data.message);
}else{
$mess.slideDown(3000,function(){
$mess.css('display','block');
}).html('信息添加失败，请检查');
}
});
})
})
</script>
</head>
<body>
<div style="display:none; color:red;"
id="mess"></div>
<form action="" method="get">
标题：<input type="text"
name="title" /><br
/>
信息：<input type="text"
name="message" /><br
/>
<input type="button" value="提交"
/>
</form>
</body>
</html>
ThinkPHP方法：
MessageAction.class.php
<?php
class MessageAction extends Action{
function
index(){
$this->display();
}
function
addtwo(){
$m=M('message');
if($vo=$m->create()){
if($m->add()){
$this->ajaxReturn($vo,'添加成功',1);
}else{
$this->ajaxReturn(0,'添加失败',0);
}
}else{
$this->error($m->getError());
}
}
}
?>
模板index.html
<html>
<head>
<script type="text/javascript"
src="__PUBLIC__/Js/Base.js"></script>
<script type="text/javascript"
src="__PUBLIC__/Js/prototype.js"></script>
<script type="text/javascript"
src="__PUBLIC__/Js/mootools.js"></script>
<script type="text/javascript"
src="__PUBLIC__/Js/ThinkAjax.js"></script>
<script type="text/javascript">
function
add(){
//ThinkAjax.sendForm(表单ID,URL,回调函数,信息显示的地方);
ThinkAjax.sendForm('frm','__URL__/addtwo',wc);
}
function
wc(data,status){
if(status!=1){
alert('发送失败');
}else{
$('list').innerHTML+='标题'+data.title+',信息'+data.message;
}
}
</script>
</head>
<body>
<div
id="list"></div>
<form action="" method="POST"
id="frm">
标题：<input type="text"
name="title" /><br
/>
信息：<input type="text"
name="message" /><br
/>
<input type="button" value="提交" onClick="add()"
/>
</form>
</body>
</html>
public function getExpress(){
$num = I("num");
$express = new \Org\Util\Express();
$info = $express -> getorder($num);
//dump($info);
$nu = $info['nu'];
$state = $info['state'];
$data = $info['data'];
$this->assign('nu',$nu);
$this->assign('state',$state);
$this->assign('data',$data);
$this->display();
}这是thinkphp的代码
<script>
$(document).ready(function () {
$("#form").submit(function(event){
event.preventDefault();
var $form = $(this),
num = $form.find('input[name = "num"]').val(),
url = $form.attr("action");
$("#result").html("载入中。。。");
$.post(url,{num:num},function(data){
$("#result").empty().append(data);
})
});
})
</script>
这是基于jquery的ajax的代码
给你参考一下
下面是参考网站 里面有实例可以下载使用
$.ajax({
url:"",//这里是要提交的url
type:"",//这里是提交类型有post，get两种
data:{},//这里面是要传的值，json格式，如"name":name,"passwd":passwd
dataType:"",//这里是返回值的类型，如果不是返回数组的话不用设置
async:"true/false",//这里是设置同步或者是异步
success:function(){//这里是提交成功返回的函数
},
error:function(){//这里是提交失败返回的函数
}
});
希望我的回答对你有所帮助，望采纳
|
广告 您可能关注的内容 |
