Yii2 - 复选框更改提交 ActiveForm

Yii2 - checkbox change commit ActiveForm

在 index.php 中,活动表单中有一个复选框

<div class="form-group pull-right" style="margin-right: 10px">
    <?php Pjax::begin(['id' => 'options']); ?>
    <?php $form = ActiveForm::begin(['method' => 'get', 'action' => ['ensemble/index'], 'options' => ['data-pjax' => true]]); ?>

    <?= $form->field($searchModel, 'completed')->checkbox(); ?>
    <?= Html::submitButton('Apply', ['class' => 'btn btn-success']) ?>

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

index.php

里面还有kartik gridview
<?= GridView::widget($gridConfig); ?>

配置如下

$gridConfig['pjax'] = true;
$gridConfig['pjaxSettings'] = ['options' => ['id' => 'pjaxGrid']];

具有 index 操作的 ensemble 控制器看起来像这样

public function actionIndex()
{
    $searchModel = new EnsembleSearch();
    $dataProvider = $searchModel->search(Yii::$app->request->queryParams);

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

这一切都很好。我可以选中/取消选中复选框字段并点击提交按钮;然后重新加载 gridview。真酷。

现在我想知道是否可以只通过单击复选框来完成此操作?因此,如果我选中/取消选中该复选框,gridview 将被重新加载(pjax'd)。

干杯, 吕克

我会说你可以用 JavaScript 做到这一点。你可以这样做:

  1. 您必须知道如何识别 Form 和 Checkbox(您可以为它们分配 id..)

  2. 在 JavaScript 中你可以这样做:

    变量形式 = document.getElementById("form-id");

    document.getElementById("your-checkbox-id").addEventListener("click", function () { form.submit(); });

如本回答中所述: submit form with javaScript

将 id 分配给您的表单,并将 class 分配给您的复选框。

<div class="form-group pull-right" style="margin-right: 10px">
    <?php Pjax::begin(['id' => 'options']); ?>
    <?php $form = ActiveForm::begin([
            'id' => 'filter-form', 
            'method' => 'get', 
            'action' => ['ensemble/index'], 
            'options' => ['data-pjax' => true]
        ]); ?>
    <?= $form->field($searchModel, 'completed',['class'=>'status_chk'])->checkbox(); ?>
    <?= Html::submitButton('Apply', ['class' => 'btn btn-success']) ?>
    <?php ActiveForm::end(); ?>
    <?php Pjax::end(); ?>
</div>

将此脚本添加到您的 index.php 文件中。

<?php
$this->registerJs(
   '$("document").ready(function(){ 
        $(document).on("change",".status_chk", function() {
            $("#filter-form").submit();
        });
    });'
);
?>