更新引导Thumbail网 - Ajax请求 [英] Update Bootstrap Thumbail Grid - ajax request

问题描述

方案：我有一个Twitter引导格缩览图，显示了国家的视图。当用户点击一个图像，它应该显示与那个国家的城市中，在相同的网格（屏幕）。

Scenario: I have a view with a twitter bootstrap thumbnail grid that shows the countries. When the user clicks one image, it is supposed to show the cities related to that country, in the same grid (screen).

技术：首先，我填补国家dataProvider中，然后我应该发送与该国的ID给我的控制器，它在数据库中查询有关该国城市和发送新的一个Ajax请求dataProvider中，回到它更新了相同的缩略图的dataProvider新的数据视图。

Technical: First I fill the dataProvider with countries, and then I should send a ajax request with the country id to my controller where it queries the database for cities related to that country and sends the new dataProvider, back to the view where it updates the same thumbnail dataProvider with new data.

问：如何做到这一点

下面是我的code：

查看缩略图声明（视图名称：_detail）

view with thumbnail declaration (name of the view: _detail)

<?php 

            $this->widget('bootstrap.widgets.TbThumbnails', array(
            'id' => 'detailThumbnails',
            'dataProvider' => $dataprov,
            'template' => "{items}\n{pager}",
            'itemView' => '_thumb',
            ));

        ?>

查看称为缩略图ItemView控件属性（视图名称：_thumb）

view called in thumbnail "itemView" property (name of the view: _thumb)

<?php
    require_once '_detail.php';
?>
<li class="span3">
    <a href="#" class="<?php echo "thumbnail".$data['id']  ?>" rel="tooltip" data-title=" <?php echo "Clicar.."; ?>">
        <img src="<?php echo Yii::app()->getBaseUrl() . $data['photo'] ?>" alt="">
        <a href=
           "
           <?php 
           echo $className;
           echo $this->createUrl(get_class($data).'/view', array('id' => $data['id'])); 

           ?>
           "
           >
               <?php 

               echo $data['name'].$data['id']; 
               ?>
        </a>

        <?php

        Yii::app()->clientScript->registerScript('thumbClick'.$data['id'],'
                    $(".thumbnail'.$data['id'].'").click(function(){
                        var request = $.ajax({
                            data: {
                                id : '.$data['id'].'
                            },
                            type: "post",
                            url:"'.Yii::app()->createAbsoluteUrl("tripDetail/getCities").'",
                            error: function(response, error)
                            {
                                alert("Error: " + response + " : " + error);
                            },
                        });
                        $(".thumbnail'.$data['id'].'").ajaxSuccess(function() {
                            $.fn.yiiListView.update("detailThumbnails");
                        });
                    });
                ');
        ?>
    </a>
</li>

在成功的情况下，我需要更新相同的dataProvider，这是在查看名为_detail，因此require_once。什么IAM试图做的是从（下同）控制器JSON和德code在这里传递数据。但我不知道如何建立从JSON响应一个新的数据提供者，以及不知道或者如果EN code为正常进行。是吗？？？？

In case of success i need to update the same dataProvider, which is in the view named _detail, hence the require_once. What iam trying to do is pass the data from controller(below) in json and decode here. But i don't know how to build a new data provider from the json response, and dont know either if the encode is properly made. Is it????

控制器（只是一些功能）

controller (just some functions)

public function actionCreate()
        {
            $session = new CHttpSession;
            $session->open();

            if(isset($_SESSION['mySession']))
            {
                $data = $_SESSION['mySession'];

                if ($data)
                {
                    if(!isset($_GET['ajax']))
                    {
                        $dataprov = new CActiveDataProvider("Country");
                        $this->render('create', 
                                array(
                                    'dat'=>$data,
                                    'dataprov'=>$dataprov
                                    )
                                );
                    }

                }
            }
        }

        public function actionGetCities()
        {

            if(isset($_POST['id']))
            {
                $cityId = $_POST['id'];

                $dataProvider = $this->getCitiesFromDb($cityId);

                echo $this->renderPartial('_detail',array('dataprov'=> $dataProvider),true,true);   
            }
        }

        public function getCitiesFromDb($cityId)
        {
            $criteria = new CDbCriteria;  
            $criteria->select = "*";
            $criteria->condition = "b4_Country_id = " . $cityId;

            $dataProv = new CActiveDataProvider('City', 
                    array('criteria'=>$criteria));

            return $dataProv;
        }   

如果这不是正确的方式来做到这一点，请让我知道

If this is not the right way to do this, please let me know

推荐答案

好了，昨天我修正了在jQuery的问题。在生成的HTML是正确的，但没有被插入，当图像刷新，然后，一盏小灯打开：

Ok, yesterday i fixed the problem that was in the jquery. The html generated was right but was not being inserted, when the image refreshed, and then, a little light turned on:

Yii::app()->clientScript->registerScript('thumbClick'.$data['id'],'
                    $(".thumbnail'.$data['id'].'").click(function(){
                        var request = $.ajax({
                            data: {
                                id : '.$data['id'].'
                            },
                            type: "post",
                            success: function(data) {
                                $("#detailThumbnails").html(data);
                            },
                            url:"'.Yii::app()->createAbsoluteUrl("tripDetail/getCities").'",
                            error: function(response, error)
                            {
                                alert("Error: " + response + " : " + error);
                            },
                        });
                    });
                ');

的code中的一部分，上面写着sucess：

The part of the code that says "sucess: "

非常感谢所有帮助你的人给了我，特别bool.dev。你的帮助是precious。

这篇关于更新引导Thumbail网 - Ajax请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！