Javascript: within a document that's been opened by another document, script within script

I am learning javascript on my own (I’ve been programming in python and C/C++ for a while).
I am building a project that displays family photos stored on a local server. The homepage has a search bar, which opens a new page with thumbnails returned with the results of the search. I want a user to click on the thumbnail, which opens a new page with the image in full, displays the tags, and then has a form which allows a user to submit a possible correction for the tags.

I am unable to get the script that submits the correction for the tags to work properly – I expect it has to do with a document.write() containing another document.write() – the second of which has a script within a script.

my openTabWithThumbnails function is like this:
(setup and check for new tab opening omitted)

    newTab.document.write(`
    <html>
        <head>...</head>
        <body>
        <script>
        document.querySelectorAll('.thumbnail.img'.forEach( => {
            (setup some vars)
            const imageTab=window.open('','_blank');
            if (imageTab) {
                imageTab.document.write(\`
                    <html>
                    <head>...</head>
                    <body>
                        (display image)
                        (build suggestion form)
                        !!problem starts here
                        '<scr' + 'ipt>'
                            (get data and send to server)
                        '<\scr' + 'ipt>'
                   </body>
                   </html>
                \`);
                imageTab.document.close();
              }
        });
        </script>
        </body>
        </html>
     `); 
     newTab.document.close();`

I have also tried for the inner script:

    document.write('<scr' + 'ipt>');
        (get data and send to server)
    document.write('<\scr' + 'ipt>');

Also tried:

    var newscr = document.createElement('script');
    newscr.src="otherscriptfile.js";
    document.write('newscr.outerHTML');

In all cases I get the suggestion form up, but then the rest until is displayed at the bottom of the second page.

I am sure I am missing something simple. I also understand that there is likely a much better way to do what I want to do – I’ve searched but likely am asking the question improperly

You need to sign in to view this answers

Related Post