Yii2 在页面加载后在每个 GridView 行中调用操作答案

【问题标题】：Yii2 call action in each GridView row after page loadYii2 在页面加载后在每个 GridView 行中调用操作
【发布时间】：2020-04-24 03:17:30
【问题描述】：

我想知道页面加载后是否可以通过ajax为GridView的每一行自动调用动作。

我现在能做的就是通过点击按钮手动触发调用，已经正确返回了值。

这是我的 GridView：

<?php Pjax::begin(['id' => 'payment-list-view-container', 'timeout' => 5000]); ?>
    <?= GridView::widget([
        'id' => 'payment-table',
        'dataProvider' => $dataProvider,
        'resizableColumns' => false,
        'tableOptions' => ['class' => 'table table-striped'],
        'pjax'=>true,
        'pjaxSettings' => [
            'options' => [
                'id' => 'payment-table',
                'enablePushState' => false,
            ],
        ],
        'columns' => [
            [
                'class' => 'kartik\grid\SerialColumn',
                'header' => 'No.',
            ],
            [
                'header' => 'Title',
                'attribute' => 'name',
            ],
            [
                'attribute' => 'date_start',
                'header' => 'Payment Date',
                'value' => function($model){
                    return Yii::$app->formatter->asDatetime($model->payment_date, "php:d F Y");
                }
            ],
            [
                'header' => 'Action',
                'format' => 'raw',
                'value' => function($model) use ($export_type){
                    return Html::a('Open', '',
                        [
                            'data-url'=>'/model/payment/check-status/id/'. $model->id . '?exportType=' . $export_type ,
                            'class'=>'check-payment-status'
                        ]);
                }
            ],
        ],
    ]); ?>
<?php Pjax::end(); ?>

这是我的 js：

<?php
$js = <<<JS
    $(document).ready(function(){

        function checkStatus() {
            $(".check-payment-status").off().on("click", function(e){
                e.preventDefault();
                var url = $(this).attr("data-url");

                $.pjax.defaults.timeout = false;
                $.ajax({
                    url     : url,
                    type   : "post",
                    dataType: 'json',
                    success: function (response) {
                        // do something
                    }, error  : function () {
                        // do nothing
                    }
                });
            });
        }

        checkStatus();
    });
JS;

$this->registerJs($js);

我想我需要使用这样的东西，但仍然不知道如何实现它

$.each($('.check-payment-status'), function (i, el) {
                        //do something
                    });

那我真的可以这样做吗？为每一行加载页面后自动调用该操作？

【问题讨论】：

标签： ajax gridview yii2 kartik-v

【解决方案1】：

您需要做的就是触发按钮上的点击事件。

$(document).ready(function() {
    //bind the click handler
    $('.btn').on('click', function(e) {
        e.preventDefault();
        console.log("Clicked " + $(this).text());
    });
    
    //click each button
    $('.btn').each(function() {
        $(this).trigger('click');
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" class="btn">Link 1</a><br>
<a href="#" class="btn">Link 2</a><br>
<a href="#" class="btn">Link 3</a><br>

【讨论】：