Tutorial Yii2 Bagian 37 : Layout

Posted on November 28, 2017 by admin

Kali ini kita akan membedakan layout pada login page. 1. Buat layout untuk login. Tempat untuk mengatur layout terdapat di folder views/layouts. Jika kita ingin menambahkan layout baru, buatlah di dalam folder ini. Buat file baru loginLayout.php . Layout dibuat sama dengan main.php, hanya saja navbar dan breadcrumbs dihapus :

<?php

/* @var $this \yii\web\View */
/* @var $content string */

use backend\assets\AppAsset;
use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use common\widgets\Alert;

AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?= Html::csrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>

<div class="wrap">
    <div class="container">
        <?= $content ?>
    </div>
</div>

<footer class="footer">
    <div class="container">
        <p class="pull-left">&copy; My Company <?= date('Y') ?></p>

        <p class="pull-right"><?= Yii::powered() ?></p>
    </div>
</footer>

<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>

<?php

/* @var $this \yii\web\View */

/* @var $content string */

use backend\assets\AppAsset;

use yii\helpers\Html;

use yii\bootstrap\Nav;

use yii\bootstrap\NavBar;

use yii\widgets\Breadcrumbs;

use common\widgets\Alert;

AppAsset::register($this);

<?php $this->beginPage() ?>

<!DOCTYPE html>

<html lang="<?= Yii::$app->language ?>">

<head>

<?= Html::csrfMetaTags() ?>

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

<?php $this->head() ?>

</head>

<body>

<?php $this->beginBody() ?>

<?= $content ?>

</div>

<p class="pull-left">© My Company <?= date('Y') ?></p>

</div>

</footer>

<?php $this->endBody() ?>

</body>

</html>

<?php $this->endPage() ?>

2. Modifikasi SiteController.php pada actionLogin, tambahkan

$this->layout = 'loginLayout';

1	$this->layout = 'loginLayout';

Sehingga tampilan halaman Read more about Tutorial Yii2 Bagian 37 : Layout[…]

Tutorial Yii2 Bagian 35 : Membuat Component

Posted on November 23, 2017 by admin

Component dapat digunakan dari mana saja, tidak tergantung pada controller, model, namun sesuatu yang bisa dipanggil dari mana saja. 1. Buat folder components di dalam folder backend, dan di dalam folder components tersebut, buat satu file yang dinamakan MyComponent.php

<?php 
namespace backend\components;

use Yii;
use yii\base\Component; 

class MyComponent extends Component{

	public function hello(){
		echo "This is my Component";
	}
}

<?php

namespace backend\components;

use Yii;

use yii\base\Component;

class MyComponent extends Component{

public function hello(){

echo "This is my Component";

}

2. Modifikasi main.php yang berada di dalam folder backend\config untuk menambahkan component.

<?php
$params = array_merge(
    require(__DIR__ . '/../../common/config/params.php'),
    require(__DIR__ . '/../../common/config/params-local.php'),
    require(__DIR__ . '/params.php'),
    require(__DIR__ . '/params-local.php')
);

return [
    'id' => 'app-backend',
    'basePath' => dirname(__DIR__),
    'controllerNamespace' => 'backend\controllers',
    'bootstrap' => ['log'],
    'modules' => [
        'settings' => [
            'class' => 'backend\modules\settings\Settings',
        ],
        'gridview' =>  [
                'class' => '\kartik\grid\Module'
                // enter optional module parameters below - only if you need to  
                // use your own export download action or custom translation 
                // message source
                // 'downloadAction' => 'gridview/export/download',
                // 'i18n' => []
            ],
    ],
    'components' => [
        'user' => [
            'identityClass' => 'common\models\User',
            'enableAutoLogin' => true,
        ],
        'log' => [
            'traceLevel' => YII_DEBUG ? 3 : 0,
            'targets' => [
                [
                    'class' => 'yii\log\FileTarget',
                    'levels' => ['error', 'warning'],
                ],
            ],
        ],
        'mailer'=>[
            'class'=>'yii\swiftmailer\Mailer',
            'useFileTransport'=>false,
        ],
        'authManager'=>
            [
                'class'=>'yii\rbac\DbManager',
                'defaultRoles'=>['guest'],
            ],
        'errorHandler' => [
            'errorAction' => 'site/error',
        ],
        'MyComponent'=>[
            'class'=>'backend\components\MyComponent',
        ],
        
    ],
    'params' => $params,
];

<?php

$params = array_merge(

require(__DIR__ . '/../../common/config/params.php'),

require(__DIR__ . '/../../common/config/params-local.php'),

require(__DIR__ . '/params.php'),

require(__DIR__ . '/params-local.php')

);

return [

'id' => 'app-backend',

'basePath' => dirname(__DIR__),

'controllerNamespace' => 'backend\controllers',

'bootstrap' => ['log'],

'modules' => [

'settings' => [

'class' => 'backend\modules\settings\Settings',

'gridview' => [

'class' => '\kartik\grid\Module'

// enter optional module parameters below - only if you need to

// use your own export download action or custom translation

// message source

// 'downloadAction' => 'gridview/export/download',

// 'i18n' => []

'components' => [

'user' => [

'identityClass' => 'common\models\User',

'enableAutoLogin' => true,

'log' => [

'traceLevel' => YII_DEBUG ? 3 : 0,

'targets' => [

[

'class' => 'yii\log\FileTarget',

'levels' => ['error', 'warning'],

'mailer'=>[

'class'=>'yii\swiftmailer\Mailer',

'useFileTransport'=>false,

'authManager'=>

[

'class'=>'yii\rbac\DbManager',

'defaultRoles'=>['guest'],

'errorHandler' => [

'errorAction' => 'site/error',

'MyComponent'=>[

'class'=>'backend\components\MyComponent',

'params' => $params,

];

3. Kita akan coba tampilkan component yang baru Read more about Tutorial Yii2 Bagian 35 : Membuat Component[…]

Tutorial Yii2 Bagian 34: Full Calendar (2)

Posted on November 23, 2017 by admin

Tutorial ini adalah lanjutan dari Bagian 33 sebelumnya. Kita akan menambahkan kode javascript sehingga saat kita mengklik tanggal, akan bisa langsung menambahkan event di tanggal tersebut. Oh ya, kalau mau lihat dokumentasi fullcalendar ada di http://fullcalendar.io/docs. 1. Modifikasi index.php dengan menambahkan pop-up.

<?php

use yii\helpers\Html;
use yii\grid\GridView;
use yii\bootstrap\Modal;
/* @var $this yii\web\View */
/* @var $searchModel common\models\EventSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Events');
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="event-index">

    <?php
        Modal::begin([
            'header' => '<h4>Event</h4>',
            'id' => 'modal',
            'size' => 'modal-lg',
        ]);

        echo "<div id='modalContent'></div>";

        Modal::end(); 
    ?>


    <?= \yii2fullcalendar\yii2fullcalendar::widget(array(
          'events'=> $events,
      ));?>
</div>

<?php

use yii\helpers\Html;

use yii\grid\GridView;

use yii\bootstrap\Modal;

/* @var $this yii\web\View */

/* @var $searchModel common\models\EventSearch */

/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Events');

$this->params['breadcrumbs'][] = $this->title;

<?php

Modal::begin([

'header' => '<h4>Event</h4>',

'id' => 'modal',

'size' => 'modal-lg',

]);

echo "<div id='modalContent'></div>";

Modal::end();

<?= \yii2fullcalendar\yii2fullcalendar::widget(array(

'events'=> $events,

));?>

</div>

2. Buat main.js di frontend/web/js dan tambahkan dulu di AppAsset.

$(function(){

	$(document).on('click','.fc-day',function(){
		var date = $(this).attr('data-date');

		$.get('index.php?r=event/create',{'date':date},function(data){
			$('#modal').modal('show')
				.find('#modalContent')
				.html(data);
		});
	});

});

$(function(){

$(document).on('click','.fc-day',function(){

var date = $(this).attr('data-date');

$.get('index.php?r=event/create',{'date':date},function(data){

$('#modal').modal('show')

.find('#modalContent')

.html(data);

});

Tutorial Yii2 Bagian 33 : Full Calendar (1)

Posted on November 23, 2017 by admin

Aplikasi ini menggunakan Event Calendar. 1. Buat tabel event 2. Buat CRUD untuk tabel event 3. Install philippfrenzel yii-calendar melalui composer: https://github.com/philippfrenzel/yii2fullcalendar 4. Modifikasi frontend/controllers/EventController.php pada actionIndex

public function actionIndex()
    {
        $events = \common\models\Event::find()->all();

        $tasks = [];

        foreach ($events as $eve) {
            $event = new \yii2fullcalendar\models\Event();
            $event->id = $eve->id;
            $event->title = $eve->title;
            $event->start =  $eve->created_date;
            $tasks[] = $event;
        }

        return $this->render('index', [
            'events' => $tasks,
        ]);
    }

public function actionIndex()

{

$events = \common\models\Event::find()->all();

$tasks = [];

foreach ($events as $eve) {

$event = new \yii2fullcalendar\models\Event();

$event->id = $eve->id;

$event->title = $eve->title;

$event->start = $eve->created_date;

$tasks[] = $event;

}

return $this->render('index', [

'events' => $tasks,

]);

}

5. Modifikasi frontend/views/event/index.php

<?php

use yii\helpers\Html;
use yii\grid\GridView;

/* @var $this yii\web\View */
/* @var $searchModel common\models\EventSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Events');
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="event-index">

    <h1><?= Html::encode($this->title) ?></h1>
    <?php // echo $this->render('_search', ['model' => $searchModel]); ?>

    <p>
        <?= Html::a(Yii::t('app', 'Create Event'), ['create'], ['class' => 'btn btn-success']) ?>
    </p>
    <?= \yii2fullcalendar\yii2fullcalendar::widget(array(
          'events'=> $events,
      ));?>
</div>

<?php

use yii\helpers\Html;

use yii\grid\GridView;

/* @var $this yii\web\View */

/* @var $searchModel common\models\EventSearch */

/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Events');

$this->params['breadcrumbs'][] = $this->title;

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

<?php // echo $this->render('_search', ['model' => $searchModel]); ?>

<p>

<?= Html::a(Yii::t('app', 'Create Event'), ['create'], ['class' => 'btn btn-success']) ?>

</p>

<?= \yii2fullcalendar\yii2fullcalendar::widget(array(

'events'=> $events,

));?>

</div>

6. Event akan muncul di dalam Calendar Tutorial ini sebagai dokumentasi dan pembelajaran pribadi sekalian belajar terjemahin bahasa Inggris, dan siapa tahu bermanfaat buat Read more about Tutorial Yii2 Bagian 33 : Full Calendar (1)[…]

Tutorial Yii2 Bagian 32 : Pencarian Global

Posted on November 6, 2017November 6, 2017 by admin

Apabila kita menggunakan Gii untuk generate Crud, maka secara default di index.php terdapat kolom dengan masing-masing search field yang didasarkan pada kolom tertentu. Kali ini, kita akan membuat satu saja search field, namun bisa untuk melakukan pencarian pada kolom yang bersesuaian : 1. Uncomment

<?php echo $this->render('_search', ['model' => $searchModel]); ?>

1	<?php echo $this->render('_search', ['model' => $searchModel]); ?>

yang berada di index.php backend\views\companies. 2. Modifikasi _search.php yang berada Read more about Tutorial Yii2 Bagian 32 : Pencarian Global[…]

indocoder.com

Month: November 2017

Tutorial Yii2 Bagian 37 : Layout

Tutorial Yii2 Bagian 35 : Membuat Component

Tutorial Yii2 Bagian 34: Full Calendar (2)

Tutorial Yii2 Bagian 33 : Full Calendar (1)

Tutorial Yii2 Bagian 32 : Pencarian Global