13. DetailView

Clicking the open eye icon for a record takes you to the view page for that record. You will end up on a page similar to http://>yii-basic.loc/customers/view?id=250 (as always, replace yii-basic.loc with your actual domain).

The widget that renders the data for a record on this view page by default is the DetailView widget. Here is a typical default output for a view page showing all data for a record.

13.1 The DetailView Code

Here is the typical default code generated by Gii for using the DetailView widget. The path to the view file will resemble YII/basic/views/customers/view.php.

<?php

use yii\helpers\Html;
use yii\widgets\DetailView;

/* @var $this yii\web\View */
/* @var $model app\models\Customers */

$this->title = $model->customerNumber;
$this->params['breadcrumbs'][] = ['label' => 'Customers', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="customers-view">

    <h1><?= Html::encode($this->title) ?></h1>

    <p>
        <?= Html::a('Update', ['update', 'id' => $model->customerNumber], ['class' => 'btn btn-primary']) ?>
        <?= Html::a('Delete', ['delete', 'id' => $model->customerNumber], [
            'class' => 'btn btn-danger',
            'data' => [
                'confirm' => 'Are you sure you want to delete this item?',
                'method' => 'post',
            ],
        ]) ?>
    </p>

    <?= DetailView::widget([
        'model' => $model,
        'attributes' => [
            'customerNumber',
            'companyName',
            'contactLastName',
            'contactFirstName',
            'phone',
            'addressLine1',
            'addressLine2',
            'city',
            'state',
            'postalCode',
            'country',
            'salesRepEmployeeNumber',
            'creditLimit',
        ],
    ]) ?>

</div>

The Detail View is generated by echoing out DetailView::widget method. The method takes one parameter, an array that contains a reference to the model the record is taken from and a list of attributes.

The attribute list maps to the field names in the table referenced by the model. Just like GridView, you can include just the fields you want to display.

Again, remember to include use yii\widgets\DetailView at the top of the file.

Html::a() This is an HTML helper method that generates links. There are three parameters: The anchor text to be displayed. An array with the first element being the page the link points to. The second element is an array that generates the query string parameters. The key/value pairs are turned into query parameters and tacked on to the end of the link. Optional properties, such as what class to use for styling the link. Using class 'btn btn-danger' changes the link into a clickable button. The 'data' element allows you to display a confirm dialog box when the link is clicked. You can also set the method to 'post', which turns the link into a form submission. Clicking on the Update link on this view page takes you to: http://yii-basic.loc/customers/update?id=250

13.2 Specify Label and Data Format

Just like GridView, the row label and the data format can be specified. In fact, the specification is exactly the same as GridView.

You can allow Yii to automatically create the row label, you can use the shorthand method (fieldName:Format:Label) or you can spell it out longhand as follows:

[
	'attribute' => ' companyName ',
	'format' => 'ntext',
	'label' => 'Company Name',
],

Please refer to sections 12.4.1 and 12.4.2 detailing setting data formats and labels for GridView.