0

I have a webchat and it is working as expected. I added some custom features like maximize, minizmize etc. I want a button to open a new window with the full rendered webchat and all the already typed messages in it.

What I already tried:

newWindow.onclick = function(){
        chatWindow.style.display = "none";
        myBtn.style.display = "block";

        var divText = document.getElementById("webchat").innerHTML;
        var myWindow = window.open("","","width=800,height=500");
        var doc = myWindow.document;

        doc.open();
        doc.write(divText);
        doc.close();
    }

chatWindow is a div where my webchat is placed in. If possible I just want to tranfer the whole div (with all components) into the new created window.

myBtn is a button to open the chat, when you first load the site only this is shown (with style.display = "none" etc)

With this current code the webchat loads and all the messages gets transfered too, but all the style stuff gets lost:

enter image description here

I think that's because of "innerHTML" but I am new to HTML, so I don't really know stuff.

Edit:

When I click into "Type your message" and press enter, the window reloads and everything looks as it should.

BeschtPlaier
  • 133
  • 13
  • New window is a new context. You have to add css directives in it for this to work properly. – EddiGordo Jan 10 '20 at 07:43
  • Does this answer your question? [Open window in JavaScript with HTML inserted](https://stackoverflow.com/questions/2109205/open-window-in-javascript-with-html-inserted) – Seabizkit Jan 10 '20 at 10:05
  • @EddiGordo the problem is that I have no css applied to the webchat. Its all from a external javascript. When i click on "type your message" and press enter, the site reloads and gets all the css stuff and everything. So can I somehow get a step behind this "enter"? – BeschtPlaier Jan 10 '20 at 10:12

0 Answers0