Yuk Belajar Yii2 part 3
Tags: php, yii, tutorial, beginners
Published: 2019-07-14 05:45:14

#### Link, Render Patial, Static Pages, dan Layout

Pada artikel sebelumnya kita telah membahas tentang controller dan view, sesuai dengan janji saya pada  artikel kali ini kita akan membahas tentang :  

* Membagi konten menjadi beberapa view (render partial).
* Membuat halaman statik (static pages).
* Berbagi data antara view dengan layout.

Tetapi sebelum membahas materi di atas kita akan mengupdate beberapa bagian dari pembahasan kita sebelumnya. Pada bahasan sebelumnya kita sudah membuat list dosen. Kali ini kita akan mencoba memberi link pada view dosen agar kita bisa melihat detail dari dosen. Pertama kita perlu merubah file view daftarDosen.php menjadi seperti kode di bawah ini :

```php
<table>
    <tr>
        <th>Id</th>
        <th> nbsp nbsp nbsp</th>
        <th>Nama</th>
        <th> nbsp nbsp nbsp</th>
        <th>Tanggal lahir</th>
    </tr>

<?php foreach($dosen as $item) { ?>
<tr>
        <th><a
            href="<?=Yii::$app->urlManager->createUrl(['tutorial/detail-dosen','id' => $item['id']])?>">
            <?= $item['id'] ?>
            </a></th>
        <th></th>
        <th><a
            href="<?=Yii::$app->urlManager->createUrl(['tutorial/detail-dosen','id' => $item['id']])?>">
        <?= $item['nama'] ?>
        </a></th>
        <th></th>
        <th><b><?= $item['tanggal_lahir'] ?></b></th>
    </tr>
<?php } ?>
</table>
```

selanjutnya kita perlu membuat method baru dengan nama actionDetailDosen di dalam TutorialController, dengankode program seperti :

```php
 public function actionDetailDosen($id)
    {
        $dosen = $this->actionDataDosen();
        $hasil = null;
        foreach ($dosen as $item) {
            if ($id == $item['id'])
                $hasil = $item;
        }
        return $this->render('detailDosen', [
            'dosen' => $hasil
        ]);
    }
```

seperti sebelumnya kita perlu membuat view baru untuk action yang telah kita buat, sebelum membuat view mari kita mengingat kembali aturan penulisan pada Yii2

> catatan, Perhatikan huruf besar dan kecil di dalam penamaan padaYii2
> 
> Jika Controller mempunyai nama **TutorialController** maka akan mempunyai view dengan nama folder **tutorial**, kemudian jika nama method **actionDetailDosen** maka file view pada folder controller akan bernama **detailDosen.php** dan detailDosen.php pada browser akan dipanggil menjadi **detail-dosen**.

setelah kita membuat file detaildosen.php, maka file  tersebut kita isi dengan kode berikut :

```php
<h3>Detail Data Dosen</h3>
<br />
Nama:
<b><?= $dosen['nama'] ?></b>
<br />
Tanggal Lahir:
<?php echo Yii::$app->formatter->asDatetime($dosen['tanggal_lahir'], "php:d/m/Y"); 
// Yii::$app->formatter->asDatetime  merupakan perintah bawaan Yii2 
// untuk memformat tanggal
?>
```

Sekarang mari kita coba kode yang telah kita buat dengan membuka halamand bawah ini pada browser

[http://yii2basic.test/index.php?r=tutorial/daftar-dosen](<http://yii2basic.test/index.php?r=tutorial/daftar-dosen>)

pada tutorial kali ini kita membuat link di dua tempat pada record yang sama, yaitu id dan nama. Kedua link tersebut mengarah ke method yang sama.

#### Render Partial

Kadang kita mempunyai bagian yang sama dari beberapa konten, sehingga kita dapat membagi kesamaan konten konten tersebut menjadi bagian yang lebih kecil agar dapat di gunakan di konten lain. Sejujurnya sulit buat saya untuk menjelaskan melalui kalimat yang benar, jadi lebih baik kita langsung praktikan saja, misalnya kita mempunyai halaman seperti ini :

```
Nama Kampus

Isi Konten

Slogan kampus
```

kita belum membahas layout, jadi kita anggapsaja nama kampus sebagai header dari konte kita dan slogan kampus sebagai footer kita. Untuk kasus kita kita akan membagi header dan footer dalam file terpisah menggunakan partial view.  Untuk mengetahui partial view lebih jelas bisa menglihat di situs [Link API partial View Yii](https://www.yiiframework.com/doc/api/2.0/yii-base-controller#renderPartial). Kita pelu untuk keperluan partial view ini kita akan membuat folde bru di dalam folder **view/tutorial** folder baruini kita bernama **common** . Selanjutnya kita buat 2 buah file baru dalam folder view/tutorial/common, _namaKampus.php dan _sloganKampus.php, masukan kode ke dalam file __namaKampus.php misalnya :

```
<H4>
Marvel Univers(e)ity</br>
_______________________________________

</H4>
```

pada file _sloganKampus.php kita masukan kode :

```
<h5>
_______________________________________</br>
Membentuk kepribadian <b>Superhero</b> yang baik

</h5>
```

Setelah itu kita perlu meng update view fari halaman yang ingin kita masukan nama dan slogan.  masukan kode :

```
<?php
echo $this->context->renderPartial('common/_namaKampus');
?>
```

pada bagian atas file, dan kode berikutnya di bagian bawah :

```
<?php
echo $this->context->renderPartial('common/_sloganKampus');
?>
```

Misalnya pada file index.php akan menjadi :

```
<?php
echo $this->context->renderPartial('common/_namaKampus');
?>

<?php
$dosen = [
    [
        'nama' => 'Prof. Dadang',
        'tanggal_lahir' => '1960-07-28'
    ],
    [
        'nama' => 'Heri, ST, MM.',
        'tanggal_lahir' => '1959-09-01'
    ],
    [
        'nama' => 'Amel',
        'tanggal_lahir' => '1969-07-20'
    ]
];
?>
<table>
    <tr>
        <th>Nama</th>
        <th>Tanggal Lahir</th>
    </tr>
<?php foreach($dosen as $item) { ?>
<tr>
        <td><?php echo $item['nama'] ?></td>
        <td><?php echo $item['tanggal_lahir'] ?></td>
    </tr>
<?php } ?>
</table>

<?php
echo $this->context->renderPartial('common/_sloganKampus');
?>
```

Update juga view lainya yang telah kita buat hingga saat ini.  Jadi dengan Render Partial kita bisa membuat beberapa fitur yang  sama untuk banyak halaman, misalnya untuk menampilkan box untuk login user, atau informasi user saat ini, dan lain lain.

#### Static Pages

Halaman statik mungkint terdengar seperti topik tidak menarik, apa lagi jika memakai framework yang memudahkan kita membuat halaman halaman yang dinamis. Tetapi dalam beberapa hal statik page juga dierlukan misalnya untukmenampilkan info backgroun organisasi, info kontak dan lain-lain. 

Yii menyediakan cara yang mudah untuk kita membuat statik page dengan menggunakan method **action **dari controller.

```
public function actions()
{
    return [
        'pages' => [
        'class' => 'yii\web\ViewAction',
        ],
    ];
}
```

Sekarang mari kita mulali buat static pages, pertama kita buat folder dengan nama **pages**  baru di dalam **view/tutorial**, kemudian kita buat file baru dengan **coba.php**nama **infoKampus.php**, setelah itu isi kedua file dengan apa saja yang kita sukai, misalnya file **coba.php** saya hanga mengisi dengan isi seperti :

```
<h1>Coba</h1>
```

dan untuk isi **infokampsus.php** seperti ini :

```
<?php
echo $this->context->renderPartial('common/_namaKampus');
?>

<h3>
Daftar Dosen
</h3>
</br>
<ul>
  <li>Hulk</li>
  <li>ironman</li>
  <li>captain america</li>
</ul>

<?php
echo $this->context->renderPartial('common/_sloganKampus');
?>
```

 kemudian kita buat kode seperti ini :

```
 public function actions()
    {
        return [
            'pages' => [
                'class' => 'yii\web\ViewAction',
            ],
        ];
    }
```

letakan di bawah deklarasi class. Setelah selesai membuat semua kita bisa mengarahkan browser ke halaman :

- untuk pageg coba
  
  [http://yii2basic.test/index.php?r=tutorial/pages&view=coba](http://yii2basic.test/index.php?r=tutorial/pages&view=coba)

- untuk pages infoKampus
  
  [http://yii2basic.test/index.php?r=tutorial/pages&view=infokampus](http://yii2basic.test/index.php?r=tutorial/pages&view=infokampus)

Kita juga bisa menggunakan nama folder lain selain pages, misalnya kita buat folder baru di dalam **view/turorial** misalnya folder **kontak**, setelah itu kita buat file dengan nama jurusanMenembak.php, isi dengan kode :

```
<?php
echo $this->context->renderPartial('common/_namaKampus');
?>

<h3>
Kontak Jurusan
</h3>
</br>
<h5>
hawkeye</br>
</br>
+00 1234 567 89
</h5>

<?php
echo $this->context->renderPartial('common/_sloganKampus');
?>
```

Kemudian update method action menjadi seperti :

```
 public function actions()
    {
        return [
            'pages' => [
                'class' => 'yii\web\ViewAction',
            ],
            'kontak' => [
                'class' => 'yii\web\ViewAction',
                'viewPrefix' => 'kontak'
            ],
        ];
    }
```

untuk melihat halaman yang kita buat  arahkan browser ke alamat :

[http://yii2basic.test/index.php?r=tutorial/kontak&view=jurusanmenembak](http://yii2basic.test/index.php?r=tutorial/kontak&view=jurusanmenembak)

#### Berbagi Data View Dengan Layout

Layout adalah file yang untuk mengatur tampilan dasar yang ada di site kita, file layout sendiri terletak didalam folder **view/layout** , dan file layout standar dari Yii2 adalah **main.php**. 

Selama ini kita, jika menampilkan view dari method yang kita buat adalah bagian dari layout yang letaknya dalam area **<?= $content ?>** pada **main.php**. yang terletak antara Body Tag.

Untuk berbagi data konten yang kita buat dengan layout salah satu caranya bisa dengan variable 

```
$this->params['variable'] = 'isi variable';
```

Misalkan kita akan developer name di bagian bawah footer, tambahkan kode ini:

```
<?php
        isset($this->params['devParams']) ? 
        $this->params['devParams'] : [];
        ?>
```

tambahkan di bawah konten sehingga **main.php** menjadi seperti dibawah ini :

```
 <div class="container">
        <?php
        echo Breadcrumbs::widget([
            'links' => isset($this->params['breadcrumbs']) ? 
            $this->params['breadcrumbs'] : []
        ]);
        ?>
        <?= Alert::widget() ?>
        <?= $content ?>

         <?php
        isset($this->params['devParams']) ? 
        $this->params['devParams'] : [];
        ?>

    </div>
```

kemudian tambahkan kode berikut ke bagian paling bawah disetiap file dalam **view/tutorial** yang  telah kita buat :

```
<?php
echo $this->params['devParams'][] = 'develop by  || Avengers ||';
?>
```

Sekarang coba buka halaman mana saja yang telah kita buat dari browser, akan muncul tulisan **develop by || Avengers ||** di bagian paling bawah dari konten kita.

menggunakan parameter **params** memang sangat mudah, tetapi juga menyediakan cara lain untuk membagi data dengan view.

Yii menyediakan **Block Statement** untuk berbagi data antara view dengan layout, pada contoh kali ini kita akan membuat blok yang hanya akan menampilkan link jika kita membuka halaman dengan nama linkHalaman.php,  pada halaman lain kita hanya akan melihat blok kosong tanpa link. Untuk memulainya kita bisa menggunakan block statemen dengan syntax di bawah ini :

```
<?php $this->beginBlock('block1'); ?>
...content of block1...
$this->endBlock(); ?>
```

syntax **beginBlock()** akan mengawali block statement sedangkan syntax **endBlock()** akan mengakhiri block statement.

Untuk lebih memperjelas kita akan membuat blok statemet yang akan menampilkan  link ke halaman index dan daftarDosen. Pertama kita akan buat  **linkHalaman.php** pada foler **view/tutorial** :

```
<?php $this->beginBlock('linkHalaman'); ?>
<a href="<?=Yii::$app->urlManager->createUrl($index)?>">
    <?= 'index' ?>
    <?= '&nbsp &nbsp'?>
   <a href="<?=Yii::$app->urlManager->createUrl($daftar)?>">
    <?= 'list dosen'  ?>
<?php $this->endBlock('linkHalaman'); ?>
```

kemudian tambahkan kode dibawah pada  **main.php**, letakan tepat diatas conten :

      <div class="well">
                <a href="<?=
                Yii::$app->urlManager->createUrl(
                'tutorial/link-halaman')?>">
                kembali ke halaman link </a><br />
                <?php
                  if (isset($this->blocks['linkHalaman'])) {
                     echo $this->blocks['linkHalaman'];
                 } else {
                     ?>            
                    <i>link tidak ditampilkan</i>
                    <?php
                }
            ?>
        </div>

kemudian buat method baru pada **TutorialController.php** :

```
 public function actionLinkHalaman()
    {
        $index = 'tutorial/index';
        $daftar = 'tutorial/daftar-dosen';
        return $this->render('linkHalaman', [
            'index' => $index,
            'daftar' => $daftar
        ]);
    }
```

Setelah semua selesai kita bisa melihat hasilnya pada halaman :

[http://yii2basic.test/index.php?r=tutorial%2Flink-halaman](http://yii2basic.test/index.php?r=tutorial%2Flink-halaman)

Sejauh ini kita sudah melihat beberapa cara untuk membagi data antara view, untuk cara lainya akan kita bahas sambil membahas topik lainya.

#### Tambahan

Selanjutanya kita akan sediki membahas **PrettyUrl**, sejauh ini kita selalu menggunakan URL seperti ini :

[http://yii2basic.test/index.php?r=tutorial%2Flink-halaman](http://yii2basic.test/index.php?r=tutorial%2Flink-halaman)

> `http://yii2basic.test `= domain yng digunakan

> `index.php` = @app/Web/index

> `r=tutorial` = router yang mengarahkan ke Controller Tutorial

> `%2F` = mengarahkan ke action atau function dalam controller 

 jika kita ingin merubah contoh URL atas menjadi seperti URL yang lebihmudah kita pahami, seperti :

[http://yii2basic.test/tutorial/link-halaman](http://yii2basic.test/tutorial/link-halaman)

Kita perlu menggunakan fungsi yang telah tersedia dalam Yii2 yaitu, **PrettyUrl**. Untuk menggunakan **PrettyURL**. Pertama kita akan membuat file **.htaccess** di dalam folder root kita misalnya pada contoh ini yaitu **yii2basic**. kemudian masukan kode dibawah in pada **.htaccess** :

```
RewriteEngine on
# If a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
# Otherwise forward it to index.php
RewriteRule . web/index.php
```

Kemudian kita tambahkan kode di bawah ini pada **web.php** yang terdapat pada folder **yii2basic\config**, letakan di bagian bawah dari ``$config=>'components'``.

```
'urlManager' => [
            'enablePrettyUrl' => true,
            'showScriptName' => false,
            'rules' => []
        ],
```

hingga `$config=>'components'` menjadi seperti di bawah ini.

```
$config = [
    'id' => 'basic',
    'basePath' => dirname(__DIR__),
    'bootstrap' => [
        'log'
    ],
    'aliases' => [
        '@bower' => '@vendor/bower-asset',
        '@npm' => '@vendor/npm-asset'
    ],
    'components' => [
        'request' => [
            // !!! insert a secret key in the following (if it is empty) - this is required by cookie validation
            'cookieValidationKey' => 'c0vGsMPuS0qWtgzyHk8c4xfKYfNwOPGh'
        ],
        'cache' => [
            'class' => 'yii\caching\FileCache'
        ],
        'user' => [
            'identityClass' => 'app\models\User',
            'enableAutoLogin' => true
        ],
        'errorHandler' => [
            'errorAction' => 'site/error'
        ],
        'mailer' => [
            'class' => 'yii\swiftmailer\Mailer',
            // send all mails to a file by default. You have to set
            // 'useFileTransport' to false and configure a transport
            // for the mailer to send real emails.
            'useFileTransport' => true
        ],
        'log' => [
            'traceLevel' => YII_DEBUG ? 3 : 0,
            'targets' => [
                [
                    'class' => 'yii\log\FileTarget',
                    'levels' => [
                        'error',
                        'warning'
                    ]
                ]
            ]
        ],
        'db' => $db,
        'urlManager' => [
            'enablePrettyUrl' => true,
            'showScriptName' => false,
            'rules' => []
        ],
    ],
    'params' => $params
];
```

Setelah langkah langkah diatas, kita dapat memasukan Url, misalnya :

[http://yii2basic.test/tutorial/link-halaman](http://yii2basic.test/tutorial/link-halaman)

Sepertinya kita cukupkan sampai disini dulu, pada part selanjutnya kita mulai akan membahas tentng model. sampai jumpa di part selanjutnya.