Question

我想问一下在另一个动作中提交表单后如何刷新模态？我用yii2。

这是我的代码：

的index.php：

<?php

use yii\helpers\Html;
use yii\grid\GridView;
use yii\bootstrap\Modal;

/* @var $this yii\web\View */
/* @var $searchModel backend\models\KategoriSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = 'Kategoris';
$this->params['breadcrumbs'][] = $this->title;

$this->registerJs("
    $('#myModal').on('show.bs.modal', function (event) {
        var button = $(event.relatedTarget)
        var modal = $(this)
        var title = button.data('title')
        var href = button.attr('href')
        modal.find('.modal-title').html(title)
        modal.find('.modal-body').html('<i class=\"fa fa-spinner fa-spin\"></i>')
        $.post(href).done(function( data ) {
                modal.find('.modal-body').html(data)
        });
    })
");
?>

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

        'kateg_id',
        'kateg_nama',

        [
          'class' => 'yii\grid\ActionColumn',
          'template' => '{size} {view} {update} {delete}',
          'buttons' => [
            'size' => function($url, $model, $key) {
                return  Html::a(Html::tag('i','',
                [
                  'class'=>'fa fa-th-list',
                  'title'=>'Size'
                ]),
                [
                  'size',
                  'id'=>$model->kateg_id,
                ],
                [
                  'data-toggle'=>'modal',
                  'data-target'=>'#myModal',
                  'data-title'=>'Size',
                ]);
            }
        ]
      ],
    ],
]); ?>

<?php
  Modal::begin([
    'id' =>'myModal',
    'header' => '<h4 class="modal-title">...</h4>',
    'footer' => Html::button('Close', ['class' => 'btn btn-default','data-dismiss'=>'modal']),
  ]);
  Modal::end();
?>

我的网格视图上的大小按钮将显示从我的控制器中的动作大小返回渲染ajax的模态。

之后是我的尺寸视图：

$form = ActiveForm::begin(); ?>

  <?= $form->field($model, 'ukuran')->textInput(['id'=>'ukuran']) ?>

  <?= $form->field($model, 'kateg_id')->textInput(['id'=>'kategori','type'=>'hidden','value'=>$id]) ?>

  <div class="form-group">
      <?= Html::button('Tambah', [
        'class' => 'btn btn-primary',
        'onclick' =>'
          $.post({
            url: "' . Url::to(['kategori/size']) . '?id="+$("#kategori").val(),
            data:  {ukuran: $("#ukuran").val()},
            success: function(res){
              alert("PROCESS_SUCCES");
            }
          });
        ',
        ]) ?>
  </div>
<?php ActiveForm::end(); ?>
<?php Pjax::begin(['id' => 'pjax-grid-view']); ?>
<div id="grid">

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

        'ukuran_id',
        'ukuran',

        ['class' => 'yii\grid\ActionColumn'],
    ],
]); ?>
</div>
<?php Pjax::end(); ?>

我正在尝试在警报后添加刷新，但它不起作用。它将关闭模态并再次返回索引。

所以我很困惑应该是什么？

Answer 1

$.post({
    url: "' . Url::to(['kategori/size']) . '?id="+$("#kategori").val(),
    data:  {ukuran: $("#ukuran").val()},
    success: function(res){
        alert("PROCESS_SUCCES");
    }
});

我注意到在.post电话中，您没有对作为成功函数参数传递的res做任何事情。你只需提醒＆＃34; PROCESS_SUCCES＆＃34; （这是一个宏吗？），它停止了。要修改页面上的元素，您需要选择一个元素并使用.html()或.val()函数进行更改。像这样：

$.post({
    url: "' . Url::to(['kategori/size']) . '?id="+$("#kategori").val(),
    data:  {ukuran: $("#ukuran").val()},
    success: function (res) {
        alert("PROCESS_SUCCES");
        $("#my_output_area").html(res);
    }
});

或者，您可以使用$.ajax()代替$.post()。

$.ajax({
    type: "post",
    url: "' . Url::to(['kategori/size']) . '?id="+$("#kategori").val(),
    data:  {ukuran: $("#ukuran").val()},
    success: function (res) {
        alert("PROCESS_SUCCES");
        $("#my_output_area").html(res);
    }
});

yii2提交表单后刷新模式

1 个答案: