Yii2在gridview行中显示多个图像

时间:2016-07-28 11:35:51

标签: image gridview yii2 yii2-model

我想在网格视图单行中显示多个图像。例如:我有表A,表B和表C.

  

表A有my_id。

     

在表B中,my_id是外键。与my_id一起,它有c_id。

     

表C具有c_id,其在表B中参考。

     

表C还有一个显示图像的文件路径。

表A 中的

我有my_id如下: 1,2,3,4,5,6。

表B 中我有my_id如下。 1,1,1,2,3,3。

表B 中,我还有c_id如下。 1,2,3,4,5,6。

在表C中,我的c_id是: 1,2,3,4,5,6和这些id具有与它们中的每一个相关联的文件路径。它们是不同的图像。

现在我的gridview应该为my_id显示3个不同的图像,因为外键约束。但它只显示1张图片。

我的代码如下:

在我的模特中

 public function getPictogramsID()
{
    $pictogramsID = SdsrefGhsPictograms::find()->where(['sdsref_id' => $this->sdsref_id])->all();
    foreach ($pictogramsID as $picID){
        return $picID->pictogram_id;
    }
}



 public function getPictogramPath()
{


     $pictogramsID = GhsPictogram::find()->where(['pictogram_id' => $this->getPictogramsID()])->all();
    foreach ($pictogramsID as $picID){
        $pic = $picID->pictogram_filepath;
    }
    return $pic;

}



public function getPictogramUrl()
{

    //var_dump($this->getPictogramPath()); exit();
    return \Yii::$app->request->BaseUrl.'/web'.$this->getPictogramPath()  ;
}

我的索引文件网格视图图片代码

 [
        'label' => 'Hazards',  
        'format' => 'raw',   
        'value' => function ($data) {
                return Html::img($data->getPictogramUrl(), ['alt'=>'myImage','width'=>'20','height'=>'30']); 
            },
        ],   

我也在尝试为此添加一个自举工具提示..工具提示显示成功,但我认为循环不是以正确的方式完成,因此重复我的图像。

这是我更新的gridview代码。

 [
        'label' => 'Hazards',  
        'format' => 'raw',   
        'value' => function ($data) {
             $images = '';

    // append all images
            foreach($data->getPictogramName() as $name)     
                foreach ($data->getPictogramUrl() as $url)                   
                $images = $images.Html::img($url,['alt'=>'','width'=>'30','height'=>'30', 'data-toggle'=>'tooltip','data-placement'=>'left','title' => $name ,'style'=>'cursor:default;']);
            return $images;

        }
        ],

1 个答案:

答案 0 :(得分:1)

模型和网格视图中的逻辑错误很少。在所有这些领域,你只处理一个项目而不是三个。

在你的模特中

 public function getPictogramsID()
 {   
    $ids = [];
    $pictogramsID = SdsrefGhsPictograms::find()->where(['sdsref_id' => $this->sdsref_id])->all();
    foreach ($pictogramsID as $picID){
       $ids[] =  $picID->pictogram_id;
    }

    return $ids;// returning all three ids
 }



 public function getPictogramPath()
 {

    $pic = [];
    $pictogramsID = GhsPictogram::find()->where(['pictogram_id' => $this->getPictogramsID()])->all();
    foreach ($pictogramsID as $picID){
        $pic[] = $picID->pictogram_filepath;
    }
    return $pic;

}



public function getPictogramUrl()
{
  $url = [];
  foreach($this->getPictogramPath() as $path):
       $url[] = \Yii::$app->request->BaseUrl.'/web'.$path; 
  endforeach;
  return $url; // returning al urls
}

现在,您可以查看所有网址的循环,并使用每个网址附加图片

[
    'label' => 'Hazards',  
    'format' => 'raw',   
    'value' => function ($data) {

        $images = '';
        // append all images
        foreach($data->getPictogramUrl() as $url):
            $images = $images.Html::img($url, ['alt'=>'myImage','width'=>'20','height'=>'30']);
        endforach; 
        return $images;
    },
],