Содержание поповера iFrame внутри сетки делится пополам - PullRequest
Новая
       14

Содержание поповера iFrame внутри сетки делится пополам

0 голосов
/ 05 сентября 2018

У меня проблема. У меня есть popove, который загружает представление cshtml внутри. Представление в основном просто контейнер сетки. В начальной загрузке 3 вид был показан полностью, но в начальной загрузке 4 вид был разрезан пополам, и я не понимаю, почему.

enter image description here

Как вы можете видеть на скриншоте, вид внутри поповера разрезан пополам, а пустое пространство внизу остается неиспользованным.

HTML вида сетки контейнера: 

@{
ViewBag.Title = SharedResources.Index.BathingPlan;
}

@Html.AntiForgeryToken()

<div id="data-container">
    <div class="row-clearfix">
        <!-- left side -->
        <div class="col-md-12">
            <div class="page-title">@SharedResources.Index.BathingPlan</div>
        </div>

        <div class="col-md-12 col-sm-12">
            <div id="main-grid-container">
                <table id="mDataTable" data-cols-num="6" class="table table-striped text-center" style="border:none;" aria-describedby="mDataTable_info">
                    <thead>
                        <tr class="actions-row" role="row">
                            <td class="header-action-row text-left" style="border: none !important; cursor:default;" colspan="8">
                                <h6 class='datatable-title'><span class='fa fa-list'></span>&nbsp; @SharedResources.Index.NumberOfPersonsToBatheByDay</h6>
                            </td>
                        </tr>
                        <tr>
                            <th></th>
                            <th class="col-8 text-center">@SharedResources.Index.Monday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Tuesday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Wednesday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Thursday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Friday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Saturday</th>
                            <th class="col-8 text-center">@SharedResources.Index.Sunday</th>
                        </tr>
                    </thead>
                    <tbody data-bind="foreach: mainData" class="header-fixed-tbody">
                        <tr class="header-fixed-tr">
                            <td><span data-bind="text: PlannedHour"></span></td>
                            <!-- ko foreach: PeopleByDay() -->
                            <td data-bind="text: $data"></td>
                            <!-- /ko -->
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    </div>
    @System.Web.Optimization.Scripts.Render("~/bundles/intervention-bathing-plan")
    <script>
        $(function () {
            //initialize
            app.BathingPlan.Init();
        });
    </script>

Всплывающее содержимое вызывается с нокаутом: 

//knockout computed propeties
model.interventionAdditionalInfoUrl = ko.computed(function () {
    $("#interventionAdditionalInfo").popover('destroy');
    var url = null;

    url = GetInterventionInfoUrl(model.residentId(), model.interventionType());

    if (url != null) {
        setTimeout(
            function () {
                var content = '<iframe id="iframe-intervention-info" src="' + url + '" scrolling="yes" horizontalscrolling="no" verticalscrolling="yes" frameborder="0"></iframe>';
                $("#interventionAdditionalInfo").popover({
                    html: true,
                    placement: 'top',
                    container: 'body',
                    viewport: '#LoadModalInterventions',
                    content: content
                });
            }, 500);
    }
    return url != null ? true : false;
}, model);
...