javascript - Yii2 - yii\grid\CheckboxColumn - 批量更新并将选定的行插入到另一个表中

Question

我有一个包含这些字段的表:

aca_class_subjects: 
                    class_subject_id, class_subject_subject_id, 
                    class_subject_class_group_id, class_subject_class_id

class_subject_id 是主键，它是auto_increment。class_subject_class_id 和 class_subject_class_group_id 形成一个依赖的下拉列表。

class_subject_subject_id 来自名为 aca_subjects 的表，它将形成复选框。

Controller :AcaClassSubjectsController

public function actionCreate()
{
    $model = new AcaClassSubjects();

    $searchModel = new AcaSubjectsSearch();
    $searchModel->is_status = 0 ;
    $dataProvider = $searchModel->search(Yii::$app->request->queryParams);
    return $this->render('create', [
        'searchModel' => $searchModel,
        'dataProvider' => $dataProvider,
        'model'=> $model,
    ]);
}    

public function actionUpdate($id)
{
    $model = $this->findModel($id);

    if ($model->load(Yii::$app->request->post()) && $model->save()) {
        return $this->redirect(['view', 'id' => $model->class_subject_id]);
    } else {
        return $this->render('update', [
            'model' => $model,
        ]);
    }
}

模型:AcaClassSubjects

    public function attributeLabels()
{
    return [
        'class_subject_id' => Yii::t('aca', 'ID'),
        'class_subject_subject_id' => Yii::t('aca', 'Subject'),
        'class_subject_class_id' => Yii::t('aca', 'Class'),
        'class_subject_class_group_id' => Yii::t('aca', 'Class Group'),      
         ];
}

AcaSubjectsSearch

    public function search($params)
{
    $query = AcaSubjects::find()->where(['<>', 'is_status', 2]);

    $dataProvider = new ActiveDataProvider([
        'query' => $query, 'sort'=> ['defaultOrder' => ['subject_id'=>SORT_DESC]],
        'pagination' => [ 'pageSize' => 5 ]
    ]);

    $this->load($params);

    if (!$this->validate()) {
        // uncomment the following line if you do not want to any records when validation fails
        // $query->where('0=1');
        return $dataProvider;
    }

    $query->andFilterWhere([
        'subject_id' => $this->subject_id,
    ]);

    $query->andFilterWhere(['like', 'subject_name', $this->subject_name])
        ->andFilterWhere(['like', 'subject_code', $this->subject_code]);         

    return $dataProvider;
}

查看

<div class="col-xs-12" style="padding-top: 10px;">
    <div class="box">

		    <?php $form = ActiveForm::begin([
					'id' => 'academic-level-form',
					'enableAjaxValidation' => false,
					'fieldConfig' => [
					    'template' => "{label}{input}{error}",
					],
		    ]); ?>            
		    <div class="col-xs-12 col-lg-12 no-padding">  
		        <div class="col-xs-12 col-sm-6 col-lg-6">    

            <?= $form->field($model, 'class_subject_class_group_id')->widget(Select2::classname(), [
                'data' => ArrayHelper::map(\app\modules\academic\models\AcaClassGroups::find()->where(['is_status' => 0])->all(),'class_group_id','class_group_name'),
                'language' => 'en',
                'options' => ['placeholder' => '--- Select Class Group ---', 
                    'onchange'=>'
                        $.get( "'.Url::toRoute('dependent/getclassmaster').'", { id: $(this).val() } )
                            .done(function( data ) {
                                $( "#'.Html::getInputId($model, 'class_subject_class_id').'" ).html( data );
                            }
                        );' 
                ],
             //   'disabled'=>'true',
                'pluginOptions' => [
                    'allowClear' => true
                ],
            ]); ?>                         
		        </div>
		        <div class="col-xs-12 col-sm-6 col-lg-6">
		            <?= $form->field($model, 'class_subject_class_id')->widget(Select2::classname(), [
		            'data' => ArrayHelper::map(\app\modules\academic\models\AcaClassMaster::findAll(['class_id' => $model->class_subject_class_id]),'class_id','class_name'),
		                'language' => 'en',
		                'options' => ['placeholder' => '--- Select Class ---'],
		                'pluginOptions' => [
		                    'allowClear' => true
		                ],
		            ]); ?>                          	        
                </div>
		    </div> 

        <div class="box-body table-responsive">
           
                <h4><strong><u>Select Subject(s)</u></strong></h4>
                     
            <div class="course-master-index">
    <?= GridView::widget([
        'id'=>'grid',
        'dataProvider' => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            [
            'class' => 'yii\grid\CheckboxColumn',
            'header' => Html::checkBox('selection_all', false, [    
            'class' => 'select-on-check-all',
            'label' => 'All',
                ]),
            'visible'=> true,
            'contentOptions' =>['style' => 'vertical-align:middle;width:30px'],

                'checkboxOptions' => function($model, $key, $index, $column) {
                    return ['value' => $model->subject_id];
                }
             ],
            ['class' => 'yii\grid\SerialColumn'],

           // 'id',
            'subject_name',

                                 ],
    ]); ?>
    <?= Html::input('hidden','keylists',$value='', $options=['id'=>'keylist'])  ?>
    <div class="form-group">
        <?= Html::submitButton('Submit', ['class' =>'btn btn-success btn-block btn-lg','id'=>"button123"]) ?>
    </div>
	</div>
      </div>
      <?php ActiveForm::end(); ?>
    </div>
</div>  

我的问题是

使用表 aca_subjects 中的复选框选择特定行 (subject_id) 后，还选择下拉列表，如图所示

1. 如何将它们(class_subject_subject_id、class_subject_class_id、class_subject_class_group_id)插入表aca_class_subjects？<
2. 如何将它们(class_subject_subject_id、class_subject_class_id、class_subject_class_group_id)更新到表aca_class_subjects？<
3. 如何在未选择任何内容时显示对话框？

注意:class_subject_subject_id(gridview 中的复选框)，class_subject_class_id(下拉列表)，class_subject_class_group_id(下拉列表)

当我点击提交时，没有任何内容进入数据库

Answer 1

好吧，这个问题有点宽泛，因为您没有显示任何与具体解决问题相关的代码，所以我大胆猜测您有一个基本的 showstopper 用于从 gridview 收集 class_subject_subject_id .所以我会在我的答案中建议 javascript 部分，它使用 ajax 提交表单。

但在我建议您解决方案之前，您遇到了一个基本问题，即您使用用于在 aca_class_subjects 中插入主题的表单包装 gridview

为什么？

• 因为如果您将 Gridview 与 gridview 过滤器一起用表单包装，GridView 不会创建自己的隐藏表单，它用于提交过滤器输入以在 GridView 中进行搜索，因此当您尝试通过键入进行搜索时GridView 过滤器输入，它会将其提交给在您的外部表单中指定的操作，该操作可以像您的情况一样具有不同的操作。

因此，如果您仍然想使用 ActiveForm，请不要将 Gridview 包装在表单中，将其分开，并在调用 GridView::widget() 之前关闭它，但您已经放置了按钮在 Gridview 的末尾并且您不想更改设计，因此将按钮的代码从 Html::submitButton() 更改为 Html::button () 并将其保存在您创建的 ActiveForm 之外。您可以使用 javascript 提交表单。

所以你的 View 代码应该如下所示

<div class="col-xs-12" style="padding-top: 10px;">
    <div class="box">

        <?php
        $form = ActiveForm::begin([
                    'id' => 'academic-level-form',
                    'enableAjaxValidation' => false,
                    'action'=>\yii\helpers\Url::to(['assign-subjects'])
                    'fieldConfig' => [
                        'template' => "{label}{input}{error}",
                    ],
        ]);
        ?>            
        <div class="col-xs-12 col-lg-12 no-padding">  
            <div class="col-xs-12 col-sm-6 col-lg-6">    

                <?=
                $form->field($model, 'class_subject_class_group_id')->widget(Select2::classname(), [
                    'data' => ArrayHelper::map(\app\modules\academic\models\AcaClassGroups::find()->where(['is_status' => 0])->all(), 'class_group_id', 'class_group_name'),
                    'language' => 'en',
                    'options' => ['placeholder' => '--- Select Class Group ---',
                        'onchange' => '
                        $.get( "' . Url::toRoute('dependent/getclassmaster') . '", { id: $(this).val() } )
                            .done(function( data ) {
                                $( "#' . Html::getInputId($model, 'class_subject_class_id') . '" ).html( data );
                            }
                        );'
                    ],
                    //   'disabled'=>'true',
                    'pluginOptions' => [
                        'allowClear' => true
                    ],
                ]);
                ?>                         
            </div>
            <div class="col-xs-12 col-sm-6 col-lg-6">
                <?=
                $form->field($model, 'class_subject_class_id')->widget(Select2::classname(), [
                    'data' => ArrayHelper::map(\app\modules\academic\models\AcaClassMaster::findAll(['class_id' => $model->class_subject_class_id]), 'class_id', 'class_name'),
                    'language' => 'en',
                    'options' => ['placeholder' => '--- Select Class ---'],
                    'pluginOptions' => [
                        'allowClear' => true
                    ],
                ]);
                ?>                                      
            </div>
        </div> 
        <?=Html::input('hidden', 'keylists', $value = '', $options = ['id' => 'keylist']) ?>
        <?php ActiveForm::end(); ?>

        <div class="box-body table-responsive">

            <h4><strong><u>Select Subject(s)</u></strong></h4>

            <div class="course-master-index">
                <?=
                GridView::widget([
                    'id' => 'grid',
                    'dataProvider' => $dataProvider,
                    'filterModel' => $searchModel,
                    'columns' => [
                        [
                            'class' => 'yii\grid\CheckboxColumn',
                            'header' => Html::checkBox('selection_all', false, [
                                'class' => 'select-on-check-all',
                                'label' => 'All',
                            ]),
                            'visible' => true,
                            'contentOptions' => ['style' => 'vertical-align:middle;width:30px'],
                            'checkboxOptions' => function($model, $key, $index, $column){
                                return ['value' => $model->subject_id];
                            }
                        ],
                        ['class' => 'yii\grid\SerialColumn'],
                        // 'id',
                        'subject_name',
                    ],
                ]);
                ?>

                <div class="form-group">
                    <?=Html::button('Submit', ['class' => 'btn btn-success btn-block btn-lg', 'id' => "button123"]) ?>
                </div>
            </div>
        </div>

    </div>
</div>  

现在关于记录的保存。

您可以使用以下 javascript 代码获取 GridView 中的所有选定主题，您可以在其中选中名称为 selection[] 的所有已选中复选框。在您的 View 顶部添加以下代码

$reflect = new ReflectionClass($model);
$subjectId = $reflect->getShortName() . '[class_subject_subject_id][]';
$js = <<<JS

    $("#button123").on('click',function(e){
        e.preventDefault();
        $("#academic-level-form").yiiActiveForm('submitForm');
    });

    $("#academic-level-form").on('beforeSubmit',function(e){
        e.preventDefault();
        // yii.getCsrfParam(),yii.getCsrfToken(),
        let subjects=$("input[name='selection[]']:checked");
        let subjectsSelected=subjects.length;

         if(!subjectsSelected){
             alert('select some subjects first');
         }else{
            let data=$(this).serializeArray();

            $.each(subjects,function(index,elem){
                data.push({name:"$subjectId",value:$(elem).val()})
            });

            let url=$(this).attr('action');
            $.ajax({
                url:url,
                data:data,
                type:'POST',
            }).done(function(data){
                alert(data);
            }).fail(function(jqxhr,text,error){
                alert(error);
            });
         }
        return false;
    });
JS;
$this->registerJs($js, \yii\web\View::POS_READY);

现在，如果您在提交表单的 Controller 中的 actionAssignSubjects() 中有 print_r(Yii::$app->request->post())您可以看到已发布变量的输出，您的主题将位于您用于填充名称为 class_subject_subject_id 的下拉列表的同一模型数组下，并且所有选定的主题都将位于该数组下。您可以遍历它们以保存到您想要的模型。

我把剩下的工作留给你自己完成，如果你遇到任何问题，你应该用目标代码发布一个单独的问题。