Yii2 - Modal not loading content

Question

I am having a problem with modal window loading on staging server. Where my modal windows load on localhost (Apache) they fail to load content on staging (LiteSpeed). What is strange is that the modal opens and shows header, but no content. I get 503 error when I inspect elements.

Staging also doesn't load favicon. I suppose the problem is somewhere in configuration, but as I am just starting with Yii2, I don't know where to look anymore.

I have created the modal functionality as follows:

modal.js in web/js/modal.js

$(function(){
$(document).on('click', '.showModalButton', function(){
    if ($('#modal').data('bs.modal').isShown) {
        $('#modal').find('#modalContent')
            .load($(this).attr('value'));
        //dynamically set the header for the modal
        document.getElementById('modalHeader').innerHTML = '<button type="button" class="close" ' +
                                                                'data-dismiss="modal" aria-label="Close">' +
                                                                '<span aria-hidden="true">&times;</span>' +
                                                           '</button> ' +
                                                           '<h4>' + $(this).attr('title') + '</h4>';
    } else {
        $('#modal').modal('show')
            .find('#modalContent')
            .load($(this).attr('value'));
        //dynamically set the header for the modal
        document.getElementById('modalHeader').innerHTML = '<button type="button" class="close" ' +
                                                                'data-dismiss="modal" aria-label="Close">' +
                                                                '<span aria-hidden="true">&times;</span>' +
                                                           '</button> ' +
                                                           '<h4>' + $(this).attr('title') + '</h4>';
    }
});
});

Layout set in views/layouts/main.php (excerpt)

</footer>

<?php
Modal::begin([
    'headerOptions' => [
        'id' => 'modalHeader',
    ],
    //'footer' => '<a href="#" class="btn btn-primary" data-dismiss="modal">Close</a>',
    'id' => 'modal',
    'size' => 'modal-lg',
    //keeps from closing modal with esc key or by clicking out of the modal.
    // user must click cancel or X to close
    'clientOptions' => [
        'backdrop' => 'static',
        'keyboard' => false
    ],
]);

echo "<div id='modalContent'></div>";

Modal::end();
?>

<?php $this->endBody() ?>

View for index action (excerpt)

<p>
    <?= Html::a('Create FAQ',
        false,
        [
            'class' => 'showModalButton btn btn-success',
            'value' => '/index.html?r=faq/create',
            'title' => 'Create FAQ',
        ]) ?>
</p>

When I press button modal opens,but doesn't load the form.

If I missed some important information, please ask if it can shed light to this issue.

The page loads all the assets and I get the 503 error only on staging server.

Answer 1

use yii\bootstrap\Modal;

in your Grid View 
'panel' => [
         'before' => Html::a('<i class="glyphicon glyphicon-plus">Open Modal</i>', ['#'], ['data-toggle' => 'modal', 'class' => 'btn btn-md btn-success', 'data-target' => '#showModal']),
        'type' => GridView::TYPE_PRIMARY,
]

At the bottom add this 

Modal::begin([
    'id' => 'showModal',
    'header' => '<center><h4 class="modal-title">Allocate Work </h4></center>',
    'closeButton' => [
                  'label' => 'Close',
                  'class' => 'btn btn-danger btn-sm pull-right',
                ],


]);
echo Yii::$app->controller->renderPartial('allocation');
 Modal::end();