Ajax成功功能在空白頁面左上角顯示“1”而不刷新div

Question

我正在開發一個 yii2 應用程序。 我從 Bootstrap 模式彈出窗口中選擇數據並提交到我有插入查詢的控制器操作。 從模態彈出窗口提交數據后，提交數據后，它會在頁面左上角顯示一個帶有“1”的白頁，而不是僅關閉彈出窗口並刷新 div，而是在我檢查數據庫時插入了數據。

我的部分代碼：彈出調用

 <a class="btn btn-danger" data-toggle="modal"  data-target="#modalgroup">+Add</a> 

模態彈出代碼：

<?php
 Modal::begin([

'id' => 'modalgroup',
'size' => '',
'header'=>'<h3>Select Groups</h3>']);
 $mymodel = new \app\models\Contact();
 echo $this->render('group', ['mymodel'=>$mymodel]);
 Modal::end();
 ?>

彈出窗體

<?php
$form = ActiveForm::begin(['id'=>'select_group']);?>


 <div class="row" style="height: auto;">


<div class="col-sm-8">
    <div class="form-group form-group-sm field-profile-name">
        <?php

        $wishmodel = new GroupTran();
        $wish=Group::find()->all();
        $options =ArrayHelper::map($wish,'group_id','group_name');
        echo $form->field($model, 'group_id')->checkboxList($options)->label('Select Groups').'<br>';
        ?>
        </div>
    </div>
</div>

<div class="form-group">
<?= Html::submitButton('Select', ['class' => 'btn btn-primary']) ?>
</div>
<?php
ActiveForm::end();


?>

我的JS：

    $url= Yii::$app->request->baseUrl.'/contact/group';   

    $( "#select_group" ).on('beforeSubmit', function(e) {
   e.preventDefault();
   var form= $(this);
      $.ajax({
        type: 'post',
        url: '{$url}',
        data: form.serialize(),
        success: function () {
    $(form).trigger("reset");
      $('#modalgroup').modal('hide');   
         $('#groupdiv').load(window.location.href + '#groupdiv');   
    //$("#groupdiv").load(location.href+" #groupdiv>*");   

        }
      });
      return false;
    });

我的控制器動作

public function actionGroup()
{
    $model = new Groups();
    $post= Yii::$app->request->post();          
    $connection = \Yii::$app->db;
    foreach(($post['GroupTran']['group_id']) as $data){    
        $wishdata = Groups::find()->where(['group_id'=>$data])->all();
        if(!$wishdata)
        $connection->createCommand()->insert('tbl_groups',['group_id'=>$data])->execute();
    }

    return true;
}

請幫忙

Answer 1

您的表單on事件即beforeSubmit無效。 嘗試用submit替換它。

因此，您的form正在提交。

替換$( "#select_group" ).on('beforeSubmit', function(e) {

到$( "#select_group" ).on('submit', function(e) {