Bootstrap yii2 中的模态与多个控制器

Question

我有一个视图 checkin 和 message，我想在 checkin/index 页面

中将 message/create 显示为 modal

这是我到目前为止所做的

 <div class="checkin-index">

<h1><?= Html::encode($this->title) ?></h1>
<?php // echo $this->render('_search', ['model' => $searchModel]); ?>

<div class="common-button">
    <p>
        <?= Html::a('Send Message', ['message/create'] ,['class' => 'btn btn-danger','id' => 'buttonMessage','data-pjax' => '0']) ?>
    </p>
</div>
<?php
    Modal::begin(['id' =>'modalMessage']);
    Modal::end();
?>

<?php Pjax::begin(['id' => 'event-grid', 'timeout' => false]); ?>

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

                'attribute' => 'event_id',
                'label' => 'Event Title',
                'value' => 'event.title'
            ],
            [
                'attribute' => 'fullName',
                'label' => 'Name',
                'value' => 'users.fullname',
            ],
            [
                'attribute' => 'user_id',
                'label' => 'Email',
                'value' => 'users.email',
            ],
            'user_type',
        ],
    ]);
 ?>
<?php Pjax::end(); ?>

<?php
// You only need add this,
$this->registerJs('
    var gridview_id = ""; // specific gridview
    var columns = [2]; // index column that will grouping, start 1

    var column_data = [];
        column_start = [];
        rowspan = [];

    for (var i = 0; i < columns.length; i++) {
        column = columns[i];
        column_data[column] = "";
        column_start[column] = null;
        rowspan[column] = 1;
    }

    var row = 1;
    $(gridview_id+" table > tbody  > tr").each(function() {
        var col = 1;
        $(this).find("td").each(function(){
            for (var i = 0; i < columns.length; i++) {
                if(col==columns[i]){
                    if(column_data[columns[i]] == $(this).html()){
                        $(this).remove();
                        rowspan[columns[i]]++;
                        $(column_start[columns[i]]).attr("rowspan",rowspan[columns[i]]);
                    }
                    else{
                        column_data[columns[i]] = $(this).html();
                        rowspan[columns[i]] = 1;
                        column_start[columns[i]] = $(this);
                    }
                }
            }
            col++;
        })
        row++;
    });
');

     $this->registerJs(
         '$( document ).ajaxStart(function() {
                    $("body").addClass("loading");
            });

            $( document ).ajaxComplete(function() {
                    $("body").removeClass("loading");
            });'
     );

?>

我还创建了一个 javascript 来加载和显示模态，它在 AppAsset 中，代码是

$(function() {
$('#buttonMessage').click(function(e) {
    e.preventDefault();
    $('#modal').modal('show').find('.modal-content')
        .load($(this).attr('href'));
   });
});

但是当我点击 send message 按钮时，它不会打开模式，但会在 firebug 中显示一些错误，说

Synchronous XMLHttpRequest on the main thread is deprecated because of its 
detrimental effects to the end user's experience.
For more help, check http://xhr.spec.whatwg.org/.

那我做错了什么？？？我需要在某个地方指定它来自不同的 model 和 controller 我打电话吗？？

Answer 1

试试这个方法：

$(function() {
   $('#buttonMessage').click(function(e) {
     e.preventDefault();
     $('#modal').modal('show').find('.modal-content')
     .load($(this).attr('href'));
   });
});

Bootstrap yii2 中的模态与多个控制器

Bootstrap Modal in yii2 with multiple controller

javascript

modal-dialog

bootstrap-modal

yii2

yii2-advanced-app