yii中实现ajax

进行以下步骤:

  1. 创建一个控制器protected/controllers/QuoteController.php:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?php
class  QuoteController  extends  Controller
{
     private  $quotes  array (
         array ( '你要相信世界上每一个人都精明,要令人信服并喜欢和你交往,那才最重要。' '李嘉诚' ),
         array ( '该放下时且放下,你宽容别人,其实是给自己留下来一片海阔天空。' '于丹' ),
         array ( '免费,是世界上最贵的东西。' '马云' ),
         array ( '没有捕捉不到的猎物,就看你有没有野心去捕;没有完成不了的事情,就看你有没有野心去做。' '狼图腾' ),
         array ( '君志所向,一往无前,愈挫愈勇,再接再厉。' '孙中山' ),
     );
          
     private  function  getRandomQuote()
     {
         return  $this ->quotes[ array_rand ( $this ->quotes, 1)];
     }
          
     function  actionIndex()
     {
         $this ->render( 'index' array (
             'quote'  =>  $this ->getRandomQuote()
         ));
     }
          
     function  actionGetQuote()
     {
         $this ->renderPartial( '_quote' array (
             'quote'  =>  $this ->getRandomQuote(),
         ));
     }
}

2.我们需要两个视图。第一个是protected/views/quote/index.php:

1
2
3
4
5
6
7
8
<h2>每日一句</h2>
<div id= "quote-of-the-day" >
     <?php  $this ->renderPartial( '_quote' array (
         'quote'  =>  $quote ,
     ))?> 
</div>
<?php  echo  CHtml::ajaxLink( '下一个' array ( 'getQuote' ),
         array ( 'update'  =>  '#quote-of-the-day' ))?>

    第二个视图是protected/views/quote/_quote.php。

1
&ldquo;<?php  echo  $quote [0]?>&rdquo;, <?php  echo  $quote [1]?>

现在,访问你的quote控制器,并点击”下一个“链接,怎么样,简单吧。

images/book2/chapter3/1.jpg

它是如何工作的...

首先,我们在 quote 的控制器里定义了一个私有属性: $quote,和一个方法来获取随机名言 (注: 在一个真实的项目中,你应该使用DAO或AR从数据库获取值)。

然 后,我们为 index 操作定义了一个视图(index)和一个局部视图(_quote)。 这个局部视图被getQuote操作渲染时,是没有布局 的,并且是 index 的视图页面的组成部分。 在index操作中,我们使用CHtml:ajaxLink来创建链接。它创建了一个访问 getQuote操作的请求,并且在响应中,根据页面中的”quote-of-the-day”ID更新了HTML的元素。CHtml:ajaxLink 在结果页面中生成了以下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type= "text/javascript" >
/*<![CDATA[*/
jQuery( function ($) {
    jQuery( 'body' ).delegate( '#yt0' , 'click' , function (){
         jQuery.ajax({
             'url' : '/quote/getQuote' ,
             'cache' : false ,
             'success' : function (html){
                 jQuery( "#quote-of-the-day" ).html(html)
             }
         });
         return  false ;
     });
});
/*]]>*/
</script>

自从jQuery被Yii框架深度集成后,它就会自动的在页面中加载,使用起来非常方便。 并且不 管我们在页面中使用了多少次,它仅会被加载一次。

 

在 index视图中,可以看到Yii为我们生成了一个叫做#yt0的ID。这样,就不用担心手动设定ID带来的烦恼。 不过,如果在页面中使用了ajax加 载局部,而这个被包含进来的页面使用了带有JS功能的插件,或者使用了CHtml AJAX helpers,那么为了避免ID冲突,就需要手动设定这些 ID了。

 

如果你想要自定义ajax的请求成功后的回调函数,那么可以通过第三个参数来实现:

1
2
3
4
<?php  echo  CHtml::ajaxLink( 'Next quote' array ( 'getQuote' ),
array ( 'success'  => 'js: function (data){
     alert(data);
}'))?>

注: 这里我们使用了”js:”前缀,当你使用了JS代码,而非字符串的时候,需要使用这个作为标识。

在一些情况下,我们需要getQuote操作只能通过Ajax 访问,那么有两种方法来限定它。第一种方法,使用内置的ajaxOnly过滤器:

1
2
3
4
5
6
7
8
9
class  QuoteController  extends  Controller
{
     function  filters()
     {
         return  array (
             'ajaxOnly + getQuote' ,
         );
     }
...

添加完过滤器之后,再直接访问getQuote操作,就会得到一个400错误。

第二种方法,使用一个特殊的方法去探测这个请求是不是Ajax的。例如,如果我们需要将非Ajax的请求重定向到一个标准的404错误页面,可以这样做:

1
2
3
4
5
6
7
8
9
function  actionGetQuote()
{
     if (!Yii::app()->request->isAjaxRequest)
         throw  new  CHttpException(404);
            
     $this ->renderPartial( '_quote' array (
         'quote'  =>  $this ->getRandomQuote(),
     ));
}

还有一些方法可以让Action同时接受Ajax和非Ajax 请求:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function  actionGetQuote()
{
     $quote  $this ->getRandomQuote();
     if (Yii::app()->request->isAjaxRequest)
     {
         $this ->renderPartial( '_quote' array (
             'quote'  =>  $quote ,
         ));
     }
     else  {
         $this ->render( 'index' array (
             'quote'  =>  $quote ,
         ));
     }
}

在一些情况下,我们需要getQuote操作只能通过Ajax 访问,那么有两种方法来限定它。第一种方法,使用内置的ajaxOnly过滤器:

1
2
3
4
5
6
7
8
9
class  QuoteController  extends  Controller
{
     function  filters()
     {
         return  array (
             'ajaxOnly + getQuote' ,
         );
     }
...

添加完过滤器之后,再直接访问getQuote操作,就会得到一个400错误。

第二种方法,使用一个特殊的方法去探测这个请求是不是Ajax的。例如,如果我们需要将非Ajax的请求重定向到一个标准的404错误页面,可以这样做:

1
2
3
4
5
6
7
8
9
function  actionGetQuote()
{
     if (!Yii::app()->request->isAjaxRequest)
         throw  new  CHttpException(404);
          
     $this ->renderPartial( '_quote' array (
         'quote'  =>  $this ->getRandomQuote(),
     ));
}

还有一些方法可以让Action同时接受Ajax和非Ajax 请求:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function  actionGetQuote()
{
     $quote  $this ->getRandomQuote();
     if (Yii::app()->request->isAjaxRequest)
     {
         $this ->renderPartial( '_quote' array (
             'quote'  =>  $quote ,
         ));
     }
     else  {
         $this ->render( 'index' array (
             'quote'  =>  $quote ,
         ));
     }
}

转载于:https://www.cnblogs.com/topyii/archive/2013/06/06/ajax_yii.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值