ajax search Archives - indocoder.com

Membuat ajax search pada index.php menggunakan PJax cukup mudah :

use yii\widgets\Pjax;

1	use yii\widgets\Pjax;

Modifikasi index.php dengan menambahkan baris ini :

<?php Pjax::begin();?>
...
...
...
<?php Pjax::end(); ?>

<?php Pjax::begin();?>

...

<?php Pjax::end(); ?>

Sehingga index.php menjadi seperti ini :

<?php

use yii\helpers\Html;
use yii\grid\GridView;
use dosamigos\datepicker\DatePicker;
use yii\widgets\Pjax;

/* @var $this yii\web\View */
/* @var $searchModel backend\models\CompaniesSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = 'Companies';
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="companies-index">

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

    <p>
        <?= Html::a('Create Companies', ['create'], ['class' => 'btn btn-success']) ?>
    </p>
    <?php Pjax::begin();?>
    <?= GridView::widget([
        'dataProvider' => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            ['class' => 'yii\grid\SerialColumn'],

            //'company_id',
            'company_name',
            'company_email:email',
            'company_address',
            [
                'attribute'=>'company_start_date',
                'value'=>'company_start_date',
                'format'=>'raw',
                'filter'=>DatePicker::widget([
                    'model' => $searchModel,
                    'attribute' => 'company_start_date',
                        'clientOptions' => [
                            'autoclose' => true,
                            'format' => 'yyyy-m-d'
                        ]
                ])
            ],
            //'company_start_date',
            // 'company_created_date',
            // 'company_status',
            // 'logo',

            ['class' => 'yii\grid\ActionColumn'],
        ],
    ]); ?>
    <?php Pjax::end(); ?>
</div>

<?php

use yii\helpers\Html;

use yii\grid\GridView;

use dosamigos\datepicker\DatePicker;

use yii\widgets\Pjax;

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

/* @var $searchModel backend\models\CompaniesSearch */

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

$this->title = 'Companies';

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

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

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

<p>

<?= Html::a('Create Companies', ['create'], ['class' => 'btn btn-success']) ?>

</p>

<?php Pjax::begin();?>

<?= GridView::widget([

'dataProvider' => $dataProvider,

'filterModel' => $searchModel,

'columns' => [

['class' => 'yii\grid\SerialColumn'],

//'company_id',

'company_name',

'company_email:email',

'company_address',

[

'attribute'=>'company_start_date',

'value'=>'company_start_date',

'format'=>'raw',

'filter'=>DatePicker::widget([

'model' => $searchModel,

'attribute' => 'company_start_date',

'clientOptions' => [

'autoclose' => true,

'format' => 'yyyy-m-d'

]

])

//'company_start_date',

// 'company_created_date',

// 'company_status',

// 'logo',

['class' => 'yii\grid\ActionColumn'],

]); ?>

<?php Pjax::end(); ?>

</div>

Sekarang kita tidak perlu merefresh halaman untuk melakukan pencarian pada gridview. Tutorial ini sebagai dokumentasi dan pembelajaran pribadi sekalian belajar terjemahin bahasa Inggris, dan siapa tahu bermanfaat buat orang Read more about Tutorial Yii2 Bagian 16 : Membuat Ajax Search pada Gridview dengan PJax[…]