I have a grid and i would like to implement an image but it always returns the path to the image
this is the code:
[
'attribute' => 'picture',
'value'=>function($data) { return $data->imageurl; },
'value' => function ($data) {
return Html::img(Yii::getAlias('#web').'/images/user_accounts.png',
['width' => '70px']);
},
],
The above idea i got from This link but it fails
I have also tried :
[
'attribute' => 'picture',
'value'=>function($data) { return $data->imageurl; },
],
And added
public function getImageurl()
{
return \Yii::$app->request->BaseUrl.'/images/user_accounts.png';
}
But it still fails to display the image to the grid
This is what is displayed
Try this:
[
'attribute' => 'picture',
'format' => 'html',
'value' => function ($data) {
return Html::img(Yii::getAlias('#web').'/images/'. $data['imageurl'],
['width' => '70px']);
},
],
Use the format attribute of the DataColumn class, by default it uses the text format, so the content is displayed as text instead of html. Use the raw or html formatters
>>>This may be helpfull too...
[
'attribute' => 'picture',
'format' => 'html',
'value' => function ($data) {
return Html::img($data->imageurl,['width' => '80px']);
},
'filterType' => GridView::FILTER_SELECT2,
'filter' => '',
'filterWidgetOptions' => [
'pluginOptions' => ['allowClear' => true],
],
'filterInputOptions' => ['placeholder' => 'Image Url'],
],
Related
I wrote a Prestashop module to add two fields in the CMS Category but the render is wrong.
My source code:
<?php
class NewsSlider extends Module {
public function hookActionCmsPageCategoryFormBuilderModifier(array $params) {
$formBuilder = $params['form_builder'];
$locales = $this->get('prestashop.adapter.legacy.context')->getLanguages();
$formBuilder->add($this->name.'_cover_lang',
\PrestaShopBundle\Form\Admin\Type\TranslatableType::class,
[
'type' => \Symfony\Component\Form\Extension\Core\Type\FileType::class,
'label' => $this->l('Image de couverture'),
'options' => [
'required' => false,
'constraints' => [
'mimeTypes' => [
'image/png',
'image/jpeg'
],
'mimeTypesMessage' => 'JPEG/PNG',
]
],
'required' => false,
]
);
$formBuilder->add($this->name.'_header_lang',
\PrestaShopBundle\Form\Admin\Type\TranslateType::class,
[
'type' => \PrestaShopBundle\Form\Admin\Type\FormattedTextareaType::class,
'label' => $this->l('Entête de la page'),
'locales' => $locales,
'hideTabs' => false,
'required' => false
]
);
$languages = Language::getLanguages(true);
foreach($languages as $lang){
$content = $this->getCMSHeader($params['id'], $lang['id_lang'], $isCategory);
if(is_string($content) && strlen($content)) {
$params['data'][$this->name.'_header_lang'][$lang['id_lang']] = $content;
}
}
$formBuilder->setData($params['data']);
}
}
?>
You can see the render here.
And I wrote exactly the same code for the CMS Page (hookActionCmsPageFormBuilderModifier) and it's working. Why is it different?
Problem
I set orientation, but it's still at the bottom. What's the problem?
Code
<?=$form->field($contactUsModel, 'planningToTravelFrom')
->widget(\dosamigos\datepicker\DateRangePicker::className(), [
'attributeTo' => 'planningToTravelTo',
'form' => $form, // best for correct client validation
'language' => 'es',
'size' => 'lg',
'clientOptions' => [
'autoclose' => true,
'orientation' => 'top',
'format' => 'dd-M-yyyy'
]
]);?>
Problem was in
Should be 'orientation' => 'bottom'
Not works with date-range-picker bugfix
$("#contactform-planningtotravelfrom, #contactform-planningtotravelto").datepicker().on('show.bs.modal', function (event) {
// prevent datepicker from firing bootstrap modal "show.bs.modal"
event.stopPropagation();
});
I have a grid that involves truck verification. I would like the contents of the grid to change without page refresh.
Currently this works when the page is refreshed but i would like it to work even when a page is not refreshed that is when the content changes in the server database.
This is the grid
<?php
$gridColumns = [
['class' => 'kartik\grid\SerialColumn'],
'reg_no',
[
'attribute'=>'truck_category',
'value'=>'truckCategory.category'
],
[
'class' => 'kartik\grid\ActionColumn',
'vAlign'=>'middle',
'urlCreator' => function($action, $model, $key, $index) { return '#'; },
'viewOptions'=>['title'=>"vdgdv", 'data-toggle'=>'tooltip'],
'updateOptions'=>['title'=>"update", 'data-toggle'=>'tooltip'],
'deleteOptions'=>['title'=>"delete", 'data-toggle'=>'tooltip'],
]
];
echo GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => $gridColumns,
'containerOptions' => ['style'=>'overflow: auto'], // only set when $responsive = false
'beforeHeader'=>[
[
'options'=>['class'=>'skip-export'] // remove this row from export
]
],
'toolbar' => [
[],
'{export}',
'{toggleData}'
],
'pjax' => true,
'bordered' => true,
'striped' => false,
'condensed' => false,
'responsive' => true,
'hover' => true,
'floatHeader' => true,
'showPageSummary' => true,
'panel' => [
'type' => GridView::TYPE_PRIMARY
],
]);
?>
This is the controller that renders the grid
public function actionTrackingcenter()
{
$query = Truck::find()->where(['truck_status'=>5]);
$searchModel = new TruckSearch();
$dataProvider = $searchModel->search(Yii::$app->request->queryParams,$query);
return $this->render('trackingcenter/index', [
'searchModel' => $searchModel,
'dataProvider' => $dataProvider,
]);
}
Could someone give a direction on how i can achieve the automatic change
You can use below with set-time-interval with jQuery
<?php
$this->registerJs('
setInterval(function(){
$.pjax.reload({container:"YOUR_PJAX_CONTAINER_ID"});
}, 10000);', \yii\web\VIEW::POS_HEAD);
?>
This code will be place after your GridView code
This will be reload your Pjax grid every 10 second
I am using kartik grid and want to export all columns present in my table.
Problem is that i want to show only few columns in grid but download all columns in csv file.
Is it possible?
My code
<?php
$gridColumns = [
['class' => 'kartik\grid\SerialColumn'],
[
'class' => 'kartik\grid\EditableColumn',
'attribute' => 'Name',
'vAlign'=>'middle',
'headerOptions'=>['class'=>'kv-sticky-column'],
'contentOptions'=>['class'=>'kv-sticky-column'],
'editableOptions'=>['header'=>'Name', 'size'=>'255'],
'format'=>'text',
],
[
'attribute' => 'Description',
'vAlign'=>'middle',
'headerOptions'=>['class'=>'kv-sticky-column'],
'contentOptions'=>['class'=>'kv-sticky-column'],
'format'=>'text',
],
['class' => 'kartik\grid\DataColumn',
'attribute' => 'image',
'format' => 'html',
'value' => function($model, $key, $index, $column) {
return Html::img('http://localhost/demo/basic_demo/web/www/img/'.$model->image, ['class' => 'abc','width'=>70,'height'=>70]);
},
],
[
'class'=>'kartik\grid\BooleanColumn',
'attribute'=>'Status',
'vAlign'=>'middle',
],
[
'class' => 'kartik\grid\ActionColumn',
'dropdown' => true,
'vAlign'=>'middle',
'viewOptions'=>['title'=>'viewMsg', 'data-toggle'=>'tooltip'],
'updateOptions'=>['title'=>'updateMsg', 'data-toggle'=>'tooltip'],
'deleteOptions'=>['title'=>'deleteMsg', 'data-toggle'=>'tooltip'],
],
[
'class' => '\kartik\grid\ExpandRowColumn',
'header' => '',
'value' => function ($model, $key, $index) {
return GridView::ROW_COLLAPSED;
},
'detailUrl' =>Url::to(['expenses/viewdetail']),
],
];
echo GridView::widget([
'dataProvider'=> $dataProvider,
'filterModel' => $searchModel,
'columns' => $gridColumns,
'autoXlFormat'=>true,
'responsive'=>true,
'hover'=>true,
'condensed'=>true,
'floatHeader'=>true,
'bordered'=>true,
'toolbar'=>['{export}',
'{toggleData}',],
'showPageSummary'=>true,
'panel'=>[
'heading'=>'<h3 class="panel-title"><i class="glyphicon glyphicon-globe"></i> '. Html::encode($this->title).'</h3>',
'type'=>'primary',
'before'=>Html::a('<i class="glyphicon glyphicon-plus"></i>Create Expenses', ['create'], ['class' => 'btn btn-primary']),
'showFooter'=>false
],
'pjax'=>true,
'export'=>[
'fontAwesome'=>true,
'showConfirmAlert'=>false,
'target'=>GridView::TARGET_BLANK,
],
]);
?>
You can do like this in your gird column list add all column and set 'hidden' => true property which you don't want to show in grid-view but this column comes in your csv when you export csv. suppose for example here i am showing you for one column you can implement for this thing all columns. check below example code.
[
'attribute' => 'Description',
'vAlign'=>'middle',
'headerOptions'=>['class'=>'kv-sticky-column'],
'contentOptions'=>['class'=>'kv-sticky-column'],
'hidden' => true,
'format'=>'text',
],
now what happen description column will not display in gird view but it is present in exported file. i hope it is helpful for you.
On columns you my add attribute hiddenFromExport => true
For example:
'columns' => [
[
'attribute' => 'inn',
'format' => 'text',
'hiddenFromExport' => true,
],
],
It's best you pass a different array with the full grid columns rather than just the normal $gridColumns used on the web page. To keep it tidy, I have two functions in my $searchModel, one for grid columns and another for export columns. Then when setting your export menu, just call the function that returns your columns:
ExportMenu::widget([
'dataProvider' => $dataProvider,
'columns' => $searchModel->getExportColumns(),
...
]);
In your search model:
public function getGridColumns(){
return [
// page columns
];
public function getExportColumns(){
return [
// export columns
];
I'm new to yii, i want to display an image in gridview table, anyhelp will be appreciated, below is my code.
view....
<?= GridView::widget([
'dataProvider' => $dataProvider,
//'filterModel' => $searchModel,
'columns' => [
//['class' => 'yii\grid\SerialColumn'],
'product_id',
'name',
'descr',
'price',
//'image',
[
'attribute'=>'image',
'label'=>'Image',
'format'=>'html',
'value' => function ($data) {
$url = \Yii::getAlias('#backend/web/').$data['image'];
return Html::img($url, ['alt'=>'myImage','width'=>'70','height'=>'50']);
}
],
'views',
['class' => 'yii\grid\ActionColumn'],
],
'tableOptions' =>['class' => 'table table-striped table-bordered'],
I'm using dataProvider and below is my controller
public function actionIndex()
{
$searchModel = new ProductSearch();
$dataProvider = $searchModel->search(Yii::$app->request->queryParams);
//$models = $dataProvider->getModels();
return $this->render('index', [
'searchModel' => $searchModel,
'dataProvider' => $dataProvider,
//'models' => $models,
]);
}
The above code is not working fine no image display only the img alt shown
Any help on how to get this work, thanks
Here is the solution :
[
'attribute' => 'Icon',
'format' => 'html',
'label' => 'Icon',
'value' => function ($data) {
return Html::img(Yii::$app->request->BaseUrl.'/uploads/path/' . $data['Icon'],
['width' => '60px']);
},
],
Check you image path,
You can use
Yii::$app->request->baseUrl
If your index file is on root directory
$url =Yii::$app->request->baseUrl.'/'.$data['image'];
Specify 'format' to 'raw' for image column and $data should be and object, so 'image' field is accessible with $data->image.
[
'attribute'=>'image',
'label'=>'Image',
'format'=>'raw',
'value' => function ($data) {
$url = \Yii::getAlias('#backend/web/').$data->image;
return Html::img($url, ['alt'=>'myImage','width'=>'70','height'=>'50']);
}
],