Yii2：使用带有分页功能的 Pjax POST 方法在 Gridview 中搜索

Question

我是 yii2 的初学者，尝试在搜索按钮上使用 Pjax 来搜索 Gridview 中的字段。我已经使用 GET 方法完成此操作，但我想使用 POST 方法完成此操作。那么我该如何使用 Yii2 Pjax(post 方法) 和分页来做到这一点呢？

这是我的代码：

_details.php

：

<?php          

    use yii\helpers\Html;                             
    use yii\widgets\ActiveForm;         
    use yii\widgets\Pjax;  
    use kartik\depdrop\DepDrop; 


    $js = <<<JS                       
           // get the form id and set the event                         
           $('#bank-details-form').on('beforeSubmit', function(e) {           
           var form = $(this);            
           if(form.find('.has-error').length) {           
                return false;       
            }   

            $.ajax({  
                url: form.attr('action'),    
                type: 'post',   
                data: form.serialize(),   
                success: function(response) {  
                    var txtValue = $("#bankdetails-bank_name").val();   
                    if(txtValue == "")  
                    {  
                        alert("Please select bank name");  
                        return false;  
                    }   

                    var bank_name = $('#bankdetails-bank_name option:selected').text();     
                    var state     = $('#bankdetails-state option:selected').text();     
                    var district  = $('#bankdetails-district option:selected').text();      
                    var city      = $('#bankdetails-city option:selected').text();           
                    var url       = form.attr('action')+ '&BankDetails[bank_name]='+bank_name+'&BankDetails[state]='+state+'&BankDetails[district]='+district+'&BankDetails[city]='+city;         

                    $.pjax.reload({url: url, container:'#bank-grid'});        
                }       
            });                                          
        }).on('submit', function(e){                              
                e.preventDefault();                         
        });

        JS;
        this->registerJs($js); ?>

        <div class="col-lg-5">                                            

        <?php                                  

            Pjax::begin(['id' => 'bank-form']);                          
            $form = ActiveForm::begin(['id'  => 'bank-details-form',           
                                    'method' => 'post',  
                                    ]);         

            if($_REQUEST['bank_name'])
            {
                $searchModel->bank_name = $selected;
            }

            // Bank level 1
            echo $form->field($searchModel, 'bank_name')->widget(DepDrop::classname(), [
            'data'    => $bankName,
            'options' => ['placeholder' => 'Select Bank'],
            'type'    => DepDrop::TYPE_SELECT2,

            'select2Options'  => ['pluginOptions'=>['allowClear'=>true]],
            'pluginOptions'   => [
                'depends'     => [''],
                'url'         => Url::to(['/students/child-account']),
                ]
            ]);

            // State level 2
            echo $form->field($searchModel, 'state')->widget(DepDrop::classname(), [
            'type'    => DepDrop::TYPE_SELECT2,
            'data'    => $bankState,
            'options' => ['placeholder'=>'Select State'],

            'select2Options'  => ['pluginOptions'=>['allowClear'=>true]],
            'pluginOptions'   => [
                'depends'     => ['bankdetails-bank_name'],
                'url'         => Url::to(['/students/child-account']),
                'loadingText' => 'Select Bank',
            ]
            ]);

            // District level 3
            echo $form->field($searchModel, 'district')->widget(DepDrop::classname(), [
            'data'    => $bankState,
            'options' => ['placeholder' => 'Select District'],
            'type'    => DepDrop::TYPE_SELECT2,

            'select2Options'  => ['pluginOptions'=>['allowClear'=>true]],
            'pluginOptions'   => [
                'depends'     => ['bankdetails-state'],
                'url'         => Url::to(['/students/auto-populate-districts']),
                'loadingText' => 'Select District',
            ]
            ]);

            // City level 4
            echo $form->field($searchModel, 'city')->widget(DepDrop::classname(), [
            'data'    => $bankCity,
            'options' => ['placeholder' => 'Select City'],
            'type'    => DepDrop::TYPE_SELECT2,

            'select2Options'  => ['pluginOptions'=>['allowClear'=>true]],
            'pluginOptions'   => [
                'depends'     => ['bankdetails-district'],
                'url'         => Url::to(['/students/auto-populate-cities']),
                'loadingText' => 'Select City',
            ]
            ]);

        ?>

        <div class="form-group"><br/>
            <?= Html::submitButton('Search', ['class' => 'btn btn-success']) ?>
        </div>

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

    </div>

Answer 1

尝试使用Pjax的post方法：

$.pjax.reload({url: url, method: 'POST', container:'#bank-grid'}); 

Answer 2

这可能对你有帮助

Pjax::begin(['id' => 'container-id', 'timeout' => false, 'enablePushState' => false, 'clientOptions' => ['method' => 'POST']]) 

Answer 3

这个简单又有效，只需添加行

_search.php

<?php $form = ActiveForm::begin([

    'options' => ['data-pjax' => true],  # <- 1
    'action' => ['index'],               
    'method' => 'get',                   
]) ?>

index.php

<?php Pjax::begin([

    'enablePushState' => false,         # <- 2
    'timeout' => false,                 # <- 3

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

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'pager' => ['class' => \yii\bootstrap5\LinkPager::class],
    'columns' => [
        ['class' => 'yii\grid\SerialColumn'],
        ['class' => 'yii\grid\ActionColumn'],

        ...
    ],
]) ?>

<?php Pjax::end() ?>