如何在 Yii & Ajax 中加载文章而不重新加载页面 - How to load article without page reloading in Yii & Ajax

How to load article without page reloading in Yii & Ajax

本文关键字：加载新加载文章 Yii amp Ajax | 更新日期: 2023-09-27

我有一个查看数据库中的文章和每个带有孔页面加载的文章视图。所以我会在不重新加载页面的情况下加载文章，我认为使用 Ajax 这是可能的，但我对此并不那么强烈。

这是我的最初概念，如下所示：

布局：

CHtml::link($menu['items'][$itemId]['label'],
   array('articles/view',
   'id'=>$menu['items'][$itemId]['link'],
  )
);
// This showing articles name & link

视图：

<?php
    echo $model->article_body;
?>
<script>
   jQuery.ajax({
     type: 'POST',
     dataType: 'html',
     url: ('articles/view'),
     success: function(data){
         document.getElementById('articles').innerHTML = data;
     },
     error: function(){
        alert('Somthing wrong');
     }
   });
</script>

控制器：

public function actionView($id)
{
  $model=$this->loadModel($id);
   $this->render('view',array('model' => $model));
}

有人可以帮助我吗？谢谢

如果我理解正确的话，

在您的视图中，文件如下所示。

 echo CHtml::link($menu['items'][$itemId]['label'],
       array('articles/view',
       'id'=>$menu['items'][$itemId]['link'],
      ),array('class'=>'youclassnamehere')
    );
 echo '<div  id="yourDivId"></div>';

在 JavaScript 中，你的代码应该是这样的，

例如

  $(".youclassnamehere").click(function(){
         $.ajax({
          type:'POST',
         url:$(this).attr('href'),
         success:function(data){
           $("#yourDivId").html(data);
         }
         error:function(data){
          alert('Error occured please try again later..');
         }
    }),
   return false;//this will not redirect your page
});

在控制器操作中，您的代码例如

 public function actionView($id)
{
  $model=$this->loadModel($id);
   $this->render('view',array('model' => $model));
}

希望这对你有帮助

您必须返回 json：

public function actionView($id)
{
  $model=$this->loadModel($id);
  ...
                echo CJSON::encode(
                    array(
                        'status' => 'success',
                        'content' => $this->renderPartial('view',
                            array(
                                'model' => $model,
                            ),
                            true,
                            true
                        ),
                    )
                );
}

我从上面的答案中得到了解决方案，但我新添加如下：

array(
   'onclick'=>'javascript:return false'
)