** Dynamically writing html/javascript from a javascript function **

Discussion in 'Javascript' started by Robby Bankston, Jun 15, 2005.

  1. I'm working on some code and am running into brick walls. I'm trying
    to write out Javascript with Javascript and I've read the clj Meta FAQ
    and didn't see the answer, read many similar posts (with no luck
    though), and searched through the IRT.ORG Faqs
    (www.irt.org/script/script.htm).

    The Javascript is designed to open an popup window and then inside that
    window call another script which will resize that window. There may be
    another way around this but the reason I tried this approach initially
    was that I wanted to call the onload handler in the popup window to
    resize the image only after the image had completely loaded. I've had
    some code in the primary Javascript file (showimage.js) before that
    works if the image has been cached but on the first load, it doesn't
    resize properly which tells me it is probably because it is trying to
    resize the window based on the image size but it isn't completely known
    at that point. So I removed that code and tried placing the resizing
    code in the second Javascript file (resizewindow.js). BTW I've tried
    other code to open a popup image and automatically size it ie Q1443 at
    irt.org but that doesn't do exactly what we need.

    Even if there is another way to do this with one file, I still want to
    figure out why this isn't working in case I run into it in the future.

    I thought what I would need to do to use document.writeln to write
    Javascript would be to escape any special characters and to break
    apart the script tag ie

    document.writeln('<\/SCRIPT>');

    would become

    document.writeln('<\/SCR' + 'IPT>');

    I have a HTML page and 2 Javascript files. All files are in the same
    directory and have permissions set correctly.

    Here are the 3 files (keep in mind wordwrap has jacked up the
    formatting):

    index.html
    ----------
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Test</title>
    <SCRIPT type="text/javascript" LANGUAGE="JavaScript1.1"
    SRC="showimage.js">
    </SCRIPT>
    </head>

    <body>
    Click the house<BR>
    <A ONCLICK="newWindow1('house1.jpg','Nice House')"><IMG
    SRC="house1thumb.jpg"></A>
    </body>
    </html>


    showimage.js
    ------------
    function newWindow1(pic,sitename)
    {

    picWindow=window.open('','','width=25,height=25,scrollbars=1,resizable=1');
    picWindow.document.writeln('<html> <head>');
    picWindow.document.writeln('<SCR' + 'IPT type=\"text\/javascript\"
    LANGUAGE=\"JavaScript1.1\" SRC=\"resizewindow.js\"><\/SCR' + 'IPT>');
    picWindow.document.writeln('<\/head>');
    picWindow.document.writeln('<body onload=\"resizewindow();\">');
    picWindow.document.writeln('<img src=' + pic + '>');
    picWindow.document.writeln('<\/body> <\/html>');
    picWindow.document.close();
    }

    resizewindow.js
    ---------------
    function resizewindow()
    {
    // Do resizing here.
    // Right now this isn't being executed
    alert("resizing window");
    }


    Can anyone provide some pointers as to why this javascript is failing?
    I'm using IE6 on Win2k and when I click on the image to open the popup
    window, it does open the window but it is white with no content and the
    system immediately goes from about 4% CPU usage to 100% and
    consistently stays there until I kill that window with the task
    manager. I know I have something wrong in the code but I'm not sure
    where. I appreciate any comments or tips. Thanks in advance.

    cheers
    Rob
    Robby Bankston, Jun 15, 2005
    #1
    1. Advertising

  2. I use Javascript only occasionally and as such there are a lot of
    things I don't know or have forgotten so I'm sure there are stupid
    mistakes in not doing this properly and considering that much of this
    is done late at night in a sleepy state, I'm sure errors abound.
    Thanks for the input though. I'll try it out.
    Robby Bankston, Jun 15, 2005
    #2
    1. Advertising

  3. I'm still not sure why the original code bailed (inefficient as it
    was), but Andrew's suggestions
    worked perfectly. I'd still like to figure out the original problem
    but his workaround was
    more efficient, cleaner, and of course worked. Cheers.

    Let me know and I'll send you some beer or coffee of your choosing.
    Robby Bankston, Jun 15, 2005
    #3
  4. Robby Bankston

    Lee Guest

    Robby Bankston said:
    >
    >I'm still not sure why the original code bailed (inefficient as it
    >was), but Andrew's suggestions
    >worked perfectly. I'd still like to figure out the original problem


    You provided a relative path for your .js file, but since the window
    was opened without an URL, there was no valid base for it to be
    relative to.
    Lee, Jun 15, 2005
    #4
  5. Re: ** Dynamically writing html/javascript from a javascriptfunction **

    "Robby Bankston" <> writes:

    > I'm working on some code and am running into brick walls. I'm trying
    > to write out Javascript with Javascript and I've read the clj Meta FAQ
    > and didn't see the answer, read many similar posts (with no luck
    > though), and searched through the IRT.ORG Faqs
    > (www.irt.org/script/script.htm).

    ....
    > I thought what I would need to do to use document.writeln to write
    > Javascript would be to escape any special characters and to break
    > apart the script tag ie
    >
    > document.writeln('<\/SCRIPT>');
    >
    > would become
    >
    > document.writeln('<\/SCR' + 'IPT>');


    No need to split "<\/script>". The only thing that matters is the
    sequence "</", which is already escaped ...

    > I have a HTML page and 2 Javascript files.


    .... and that's only important for scripts inside HTML files. For
    separate script files, you don't even need to avoid "</".


    > <SCRIPT type="text/javascript" LANGUAGE="JavaScript1.1"


    Why JavaScript1.1? Do you know what the difference between version 1.1
    and later versions is? Just drop the "language" attribute.

    > function newWindow1(pic,sitename)


    "sitename" isn't used. Should it be the title of the window (remember,
    the title element is required in valid HTML).

    > {
    >
    > picWindow=window.open('','','width=25,height=25,scrollbars=1,resizable=1');
    > picWindow.document.writeln('<html> <head>');
    > picWindow.document.writeln('<SCR' + 'IPT type=\"text\/javascript\"
    > LANGUAGE=\"JavaScript1.1\" SRC=\"resizewindow.js\"><\/SCR' + 'IPT>');


    This could just be:
    picWindow.document.writeln('<script type="text/javascript" src='resizewindow.js"><\/script>');

    (and even without the "\" in "<\/" since it's in a separate js-file, but
    it doesn't hurt to keep it as a habit)

    > picWindow.document.writeln('<\/head>');
    > picWindow.document.writeln('<body onload=\"resizewindow();\">');
    > picWindow.document.writeln('<img src=' + pic + '>');

    Here you should have quotes around the URL:
    picWindow.document.writeln('<img src="' + pic +'" alt="...">');

    >
    > resizewindow.js
    > ---------------
    > function resizewindow()
    > {
    > // Do resizing here.
    > // Right now this isn't being executed
    > alert("resizing window");
    > }


    Try adding an alert at the top level here:
    alert("resizewindow.js loaded!");
    and see.

    > I'm using IE6 on Win2k and when I click on the image to open the popup
    > window, it does open the window but it is white with no content and the
    > system immediately goes from about 4% CPU usage to 100% and
    > consistently stays there until I kill that window with the task
    > manager.


    Impressive. Sounds like a serious bug. Nothing I can see in the code
    itself. Do you have any popup blockers?

    /L
    --
    Lasse Reichstein Nielsen -
    DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
    'Faith without judgement merely degrades the spirit divine.'
    Lasse Reichstein Nielsen, Jun 15, 2005
    #5
  6. I tried using an absolute path as well but since that didn't work, I
    just made it relative for brevity.

    Since I have a workaround, it is only academic at this point but I'm
    still interested in figuring
    out this problem.

    Thanks all.
    Robby Bankston, Jun 15, 2005
    #6
  7. I guess out of habit. Many of the examples I learned from in the
    O'Reilly Javascript guide (3rd edition) use this attribute and I have
    referenced this book many times so I guess it is out of habit.

    > Why JavaScript1.1? Do you know what the difference between version 1.1
    > and later versions is? Just drop the "language" attribute.


    > "sitename" isn't used. Should it be the title of the window (remember,
    > the title element is required in valid HTML).


    In the real code, it is used. For the purposes of the example, I
    didn't
    because it didn't seem relevant and I forgot to remove it from the
    post.

    > This could just be:
    > picWindow.document.writeln('<script type="text/javascript" src='resizewindow.js"><\/script>');
    >
    > (and even without the "\" in "<\/" since it's in a separate js-file, but
    > it doesn't hurt to keep it as a habit)


    I'll keep that in mind.

    > Try adding an alert at the top level here:
    > alert("resizewindow.js loaded!");
    > and see.


    I believe I tried that before but I'll try again.

    > Impressive. Sounds like a serious bug. Nothing I can see in the code
    > itself. Do you have any popup blockers?


    I have the Google popup blocker for IE but it was disabled for the test
    and I have
    similar problems under Netscape or Firefox and I know the Netscape
    browser doesn't
    have any popup blockers installed. Come to think of it, I tried on IE
    on a Windows
    ME box also that didn't have any popup blockers and it did the same
    thing.

    Thanks.
    Robby Bankston, Jun 16, 2005
    #7
  8. Robby Bankston

    wasntme Guest

    Re: ** Dynamically writing html/javascript from a javascriptfuncti...

    my poor example...if the post doesn't kill it.. post your resize script
    if you have problems...
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html><head><title>Test</title>
    <script type="text/javascript"><!--
    function nW1(pic,sn){
    picWindow=window.open('','','width=25,height=25,scrollbars=1,resizable=1');
    with(picWindow.document){
    open();
    write('<html><title>'+sn+'<\/title><head>\n'
    +'<script type="text/javascript"><!-- \n'
    +'function rsw(){\n'
    +'window.moveTo(0,0);\n'
    +'window.resizeTo(screen.availWidth,'
    +'screen.availHeight);\n'
    +'alert("resizing window");'
    +'} //--><\/script>'
    +'<\/head><body onload="rsw();">'
    +'<img src="'+pic+'">'
    +'<\/body><\/html>');
    close();}} //--></script></head>
    <body>Click the house<br>
    <a onClick="nW1(''house1.jpg','Nice House')"><img
    src="house1thumb.jpg"></a></body>
    </html>
    wasntme, Jun 17, 2005
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. WhiskeyRomeo

    Writing HTML & Server controls dynamically

    WhiskeyRomeo, Dec 5, 2007, in forum: ASP .Net
    Replies:
    6
    Views:
    497
    Registered User
    Dec 8, 2007
  2. ezmiller
    Replies:
    2
    Views:
    84
    ezmiller
    Dec 6, 2005
  3. ezmiller

    Problem dynamically writing HTML

    ezmiller, Dec 6, 2005, in forum: Javascript
    Replies:
    7
    Views:
    103
    Thomas 'PointedEars' Lahn
    Dec 8, 2005
  4. ezmiller
    Replies:
    2
    Views:
    123
    Thomas 'PointedEars' Lahn
    Dec 15, 2005
  5. Faisal Vali
    Replies:
    10
    Views:
    232
    Thomas 'PointedEars' Lahn
    Jun 21, 2008
Loading...

Share This Page