Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Nov 2006
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Opening frames in a separate page and NOT by "document.write" - HELP needed, please!

    Hello everyone

    I am using a search form which, on submission, uses document.write to produce a page with two frames.

    this is the document.write code:

    Code:
    function search2(item){
            stringPlus();
            resultsWindow=window.open('', 'SSearch', 'toolbar=yes,location=no,directories=no,status=yes,menubar=yes,width=1000,height=600,resizable=1,scrollbars=auto');
            resultsWindow.document.open();
            resultsWindow.document.write("<head><title>Images</title></head>");
            resultsWindow.document.write("<FRAMESET ROWS=9%,91% border=0><FRAME NAME='frame0' SRC='" + computeFrameSrc(0) + "'><FRAME NAME='frame1' SRC='" + computeFrameSrc(1) + "'></FRAMESET>");
            resultsWindow.document.close();
            got = 0;
    }


    How can I get these two frames two open up in a separate page, say results.htm, and NOT through document.write?

    It is a part of this script, which opens search results according to which boxes are checked.

    http://www.b3ta.cr3ation.co.uk/data/js/search.js

    I had edited the script, so that it would open the same results every single time.

    But how can I make the results open up in a separatly specified page rather than using document.write??


    HELPPP!

    many thanks,
    vatsal.

  • #2
    New Coder
    Join Date
    Nov 2006
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    function search2(item){
            stringPlus();
            window.open(computeFrameSrc(0), 'SSearch0', 'toolbar=yes,location=no,directories=no,status=yes,menubar=yes,width=1000,height=600,resizable=1,scrollbars=auto');
            window.open(computeFrameSrc(1), 'SSearch1', 'toolbar=yes,location=no,directories=no,status=yes,menubar=yes,width=1000,height=600,resizable=1,scrollbars=auto');
            got = 0;
    }
    or to display both frames on the same page

    Code:
    //create a basic template for the search results and save as results.htm
    <html>
    <head>
    <title>The Results</title>
    </head>
    <body>
    <iframe name="frame1" id="frame1" src="" width="300" height="200"></iframe><br>
    <iframe name="frame2" id="frame2" src="" width="300" height="200"></iframe>
    </body>
    </html>
    
    function search2(item){
            stringPlus();
            var win = window.open('results.htm', 'SSearch', 'toolbar=yes,location=no,directories=no,status=yes,menubar=yes,width=1000,height=600,resizable=1,scrollbars=auto');
            win.onload = function() {
                    win.document.getElementById('frame1').setAttribute('src',computeFrameSrc(0));
                    win.document.getElementById('frame2').setAttribute('src',computeFrameSrc(1));
            }
            got = 0;
    }
    Last edited by j9ine; 12-21-2006 at 08:09 PM.

  • #3
    New Coder
    Join Date
    Nov 2006
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hello j9ine,

    thanks a lot for the codes, the first one works well although its not what I require.



    the second one, which is what I want, does open up the window with the frames, but the frames dont display the search. they just remain empty!

    I have set up a demo page using your second code:

    http://scratchpad.50webs.com/frames/index.htm

    Any idea how to fix it?


    thanks once again for the codes.

  • #4
    New Coder
    Join Date
    Nov 2006
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Firefox requires that you wait until the document has finished loading before modifying any attributes. Therefore you need to include the win.onload to make the code work in Firefox. I originally only tested the code in FF which does work, but as it turns out IE does not need the win.onload command to make it work. The code below should work for both browsers.
    Code:
    function search2(item){
            stringPlus();
            var win = window.open('results.htm', 'SSearch', 'toolbar=yes,location=no,directories=no,status=yes,menubar=yes,width=1000,height=600,resizable=1,scrollbars=auto');
    	if (navigator.appName.indexOf('Microsoft')==-1) {
            	win.onload = function() {
                    	win.document.getElementById('frame1').setAttribute('src',computeFrameSrc(0));
                    	win.document.getElementById('frame2').setAttribute('src',computeFrameSrc(1));
            	}
    	} else {
    		win.document.getElementById('frame1').setAttribute('src',computeFrameSrc(0));
                    win.document.getElementById('frame2').setAttribute('src',computeFrameSrc(1));
    	}
            got = 0;
    }

  • #5
    New Coder
    Join Date
    Nov 2006
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi again,

    I updatged my example page with the script you provided. http://scratchpad.50webs.com/frames

    However, it shows an error in IE6, and the both the <iframes> remain blank.

    Here is the screen shot:

    http://www.b3ta.cr3ation.co.uk/data/gif/frame_error.gif

    Is it possible to obtain that without window.onload commands?
    Onload commands keep interfearing as i'm launching the frame page from within the ajax tabs.

    I want a page in frames through a separate page and NOT through document.write just so that I can target the other frame.

    I discovered that when I assigned target="frame1" to the <form> tag in the page in one of the frames, the form didnt target the action to the second frame. Instead, showed just an error.

    To get a rough idea, I want to make it like this:

    http://www.turboscout.com/index2.php...h&e=w-findwhat

    ..so that the form in the top frame has the value passed on from the submit page, and the second frmae has the search page.

    Do you think the iframes can work without the window.onload event?


    thanks

  • #6
    New Coder
    Join Date
    Nov 2006
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The document has to finish loading before you can modify any elements/attributes. Otherwise you will receive the error displayed in the screen capture you posted. Since the document hadn't finished loading before the code tried to change the iframe src it threw an error. The iframe element had not yet been loaded in the page which prevented the code from changing any of it's attributes. Therefore you have to use the onload event to insure that all elements are loaded before changing their attributes dynamically.

    However, your test page is working well in FF. This is just an issue in IE. There are a number of ways you can pass values between windows. The only thing you need to keep in mind is to make sure that the document has completed loading before modifying any elements. For example, you could choose to include the onload event in the results.htm file instead.
    Code:
    <script>
    window.onload = function() {
    //change iframe src here
    }
    </script>
    And you could pass the new values for the iframe as a parameter in the results.htm url.
    Code:
    window.open('results.htm?src1='+escape(computeFrameSrc(0))+'&src2='+escape(computeFrameSrc(0)));
    Then simply split the window.location.href value in the new window after the window.onload event is called and change the iframe src attributes.
    Code:
    window.onload = function() {
    var tmp = window.location.href.split('?src1=');
    var urls = tmp[1].split('&src2=');
    document.getElementById('frame1').setAttribute('src',unescape(urls[0]));
    document.getElementById('frame2').setAttribute('src',unescape(urls[1]));
    }
    Last edited by j9ine; 12-23-2006 at 06:00 PM.

  • #7
    New Coder
    Join Date
    Nov 2006
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I've tested this code in both IE and FF and it works without errors.
    Code:
    /********search.js**********/
    function search2(item){
            stringPlus();
            window.open('results.htm?src1='+escape(computeFrameSrc(0))+'&src2='+escape(computeFrameSrc(0)));
            got = 0;
    }
    
    /********results.htm*******/
    <html>
    <head>
    <title>The Results</title>
    <script>
    window.onload = function() {
    var tmp = window.location.href.split('?src1=');
    var urls = tmp[1].split('&src2=');
    document.getElementById('frame1').setAttribute('src',unescape(urls[0]));
    document.getElementById('frame2').setAttribute('src',unescape(urls[1]));
    }
    </script>
    </head>
    <body>
    <iframe name="frame1" id="frame1" src="" width="300" height="200"></iframe><br>
    <iframe name="frame2" id="frame2" src="" width="300" height="200"></iframe>
    </body>
    </html>

  • #8
    New Coder
    Join Date
    Nov 2006
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    man you have no clue of how relieved I am.

    I was behind this since a month, as I'm not a pro in javascript, was trying out these scripts just by trial and error.

    thanks a billion for makin it all work..

    cheers, vatsal


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •