在Yii2中提交数据后,如何在Bootstrap Modal弹出窗口中显示返回的数据?

时间:2017-08-09 06:54:45

标签: javascript ajax yii2 pjax

我有一个Modal弹出窗口,它有两个字段,第一个是提交一些信息,一个内部查询到一个数据库,该Modal弹出窗口的第二个字段是显示返回的数据。然而,当我独立测试(不是模态)时它起作用,但是当作为模态进行测试时,它只提交数据但不会在同一模态上显示任何结果,这可能是错的?感谢。

这是调用Modal弹出窗口的视图。

<?php Pjax::begin() ?>
        <p>
        <?= Html::button('Quick Search', ['value' =>Url::to('index.php?r=site/mypopup'),'class' =>'btn btn-success', 'id'=>'modalButton']) ?>
        </p>
        <?php
        Modal::begin([
        'header'=> '<h4>My Modal Popup</h4>',  
        'id' => 'modal',
        'size' => 'modal-lg',
        ]);
        echo "<div id='modalContent'></div>";
        Modal::end();
<?php Pjax::end(); ?> 

这是mypopup视图:

<?php Pjax::begin(['enablePushState' => false]); ?>

            <?php $form = ActiveForm::begin(['id' => 'mypopup-form', 'options' => ['data-pjax' => true],]); ?>

                <?= $form->field($model, 'pattern')->textArea(['rows' => 1]) ?>

                <div class="form-group">
                    <?= Html::submitButton('Submit', ['class' => 'btn btn-primary', 'name' => 'mypopup-button']) ?>
                </div>
                <?php
                     echo "<pre>";
                     //SECOND FIELD
                     print_r($model->data); 
                ?>
            <?php ActiveForm::end(); ?>
            <?php Pjax::end(); ?> 

这是mypoup的控制者:

public function actionMypopup()
    {

            $model = new PopupForm();

            if ($model->load(Yii::$app->request->post()) && $model->validate()) {

                    $model->insertPopup();
                 return $this->renderAjax('mypopup', ['model' => $model]);

            } else {
                return $this->renderAjax('mypopup', ['model' => $model]);
            }   
    } 

这是js文件:

$(function(){

    $('#modalButton').on('click', function(){
            $('#modal').modal('show')
                .find('#modalContent')
                .load($(this).attr('value'));
            }); 

        $(document).ajaxComplete(function (event, xhr, settings) {
         alert(xhr.getResponseHeader());
     });

});

0 个答案:

没有答案