innerHTML для элемента body в другом окне

101

21 апреля 2021, 16:20

У меня есть секция на вьюхе c рэндерингом партиал вью:

                   <div class="tab-content" style="padding-top:0;">
                    <div role="tabpanel" class="tab-pane active tabbable" id="right-sidebar-tabs-0" data-bind="loadingWhen: isTicketLoading">
                        <div id="printableArea">
                            <!-- ko if: ticketId() > 0 -->
                            @RenderPage("Partial/_TicketPreview.cshtml", Model)
                            <!-- /ko -->
                        </div>
                    </div>
                </div>

Есть другие секции div на этой же вью:

                           <div class="float-left">
                                <h5 style="text-align: left;font-size: 18px;" onclick="printDiv('printableArea')">Ticket preview</h5>
                            </div>

                            <div id="printableArea">
                            <!-- ko if: ticketId() > 0 -->
                            @RenderPage("Partial/_TicketPreview.cshtml", Model)
                            <!-- /ko -->
                        </div>

Функция

  function printDiv(divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var originalContents = document.body.innerHTML;
    document.body.innerHTML = printContents;
    window.print();
    document.body.innerHTML = originalContents;
}

Подменяет временно контент страницы на контент из секции с id = printableArea, потом возвращает originalContents, однако все байндинги рвутся. Вопрос - как избавиться от document.body.innerHTML = printContents чтобы не перезаписывать body документа, а вызвать это (printContents) в другом окне.

Answer 1

В новом окне

        function printDiv(divName) {
            var myWindow = window.open("", "Print Ticket");
            var printContents = document.getElementById(divName).innerHTML; 
            var divStyle=document.getElementById(divName).style;
            myWindow.document.body.innerHTML = printContents;
            myWindow.document.body.style = divStyle;
            myWindow.document.body.style.display = divStyle.display;
            myWindow.print();
        }