JavaScript - Help With Frames And Buttons

I am using a JavaScript page that acts as a 'side-by-side' tester. It sends the same form in a POST to two different servers. One server is usually the production server the other a server under test.

The results returned by the servers are displayed in two frames aligned side by side on the page.

This page has worked in Firefox for several years. It worked up till early last week. Now, instead of populating the two frames, a new window opens up to display the response received from the Server.

Nothing has changed in the code so I'm thinking that possibly the latest release of Firefox (10.0.2) has somehow broken this page.

Here is the code that is envolved:
Code:

// setting up the frames
<frameset rows="400,*">
	<frame src="file:///C:/TestSanity/controller.htm" name="controller"/>
	<frameset cols="50%,50%">
		<frame src="leftFrameInitialContent.html"   name="leftWindow"  onload='parent.controller.stopLeftFrameClock() ;'/>
		<frame src="rightFrameInitialContent.html"  name="rightWindow" onload='parent.controller.stopRightFrameClock();'/>
	</frameset>
</frameset>

// sending a request whose response will be displayed in a frame
// pick the form that matches the current command
	formToSubmit = document.getElementById(command + "_FORM") ;

	// set the left frame destination url (action) from the value on the UI
	formToSubmit.setAttribute("action", document.getElementById('leftFrameBaseUrl').value );

	// send left window request
	formToSubmit.setAttribute("target", "leftWindow");
	formToSubmit.submit();

I don't have any idea what to look for as a cause. Any help and/or suggestions would be appreciated.

Thanks,
bkey

Hello, I'd need some help for scripting.
Here is what I need to do.

I got links in frameA which open pages in frameB.
Pages might be long to load, so when I click on the link, from frameA, I want to have the "wait" cursor until body of frameB loads, then return to "default" cursor in frameA.

I'd also want the cursor to be on "wait" in all my 4 frames during the load if possible.

I can't do it with a:active in CSS cause the cursor is stuck on "wait" when it's clicked even after page in frameB is loaded.

I searched hours in forums, tried lots of things and didn't fix my problem.

Would need help, thanks

Hi,

I have a problem with my script displaying tabs (jquery tabs) in frames. When the scripts (not in frames) are viewed in the browser, the tabs are displayed correctly.
I created a script containing frames for existing scripts to be displayed in certain frames. Some scripts display fine in the frames, even some of those that contain tabs. While some may display correctly, I still get some scripts when viewed in the frames script that are not displaying the tabs correctly.
Can anyone please give me a solution to this problem.

Thank you.

First post!

Hey all! So I've been having trouble figuring out how to make this page work.

The page I'm working on has 3 frames: top/main/title frame, left frame, and right frame.

What the page is supposed to be is like a shopping page. The left frame has all the items that you can select, while the right page has the "receipt" of your selected items.

Now here's the problem:

The left frame has an "Update Order" button on the bottom that updates the receipt on the right frame. However, I can't get the button to work.

I'm not exactly sure how to write the code for the receipt frame (if there is any javascript code needed for that frame) or how to have the left frame send all that information to the right frame.


I hope this all makes sense. Thanks for taking the time to read all that!

New assignment. This is the code i have below already supplied now.
not exactly correct yet but want to just get something to work from

i need to insert an embedded script element in head section of document,
purpose os to hide htmlcode and csscode frames to provide more screen space

to hide 2 frames i am to change value of rows attribute in demo frameset to "100,1,*"

id of the frameset object is demo




Code:

<title>Web Design Demo Control Buttons</title>
<link href="title.css" rel="stylesheet" type="text/css" />
<script src="demo.htm" type="text/javascript"></script>
<script type="text/javascript">

function showPreview(id,x,y) {

 object=document.getElementById(id);
 object.style.visibility="hidden";
 top.FrameName.rows = "100,1,*";
 }
 
 
</script>

just for your reference
here is the demo part

Code:

<html>
<head>
<!-- 
   New Perspectives on JavaScript
   Tutorial 6
   Case Problem 3

   Web Design Demo

   Filename:         demo.htm
   Supporting files: css.htm, html.htm, title.htm
-->

<title>HTML Demo</title>
</head>

<frameset rows="100,210,*" id="demo" name="demo"> 
   <frame name="title" id="title" src="title.htm" scrolling="no" />
   <frameset cols="*,*">
      <frame name="code1" id="code1" src="html.htm" />
      <frame name="code2" id="code2" src="css.htm" />
   </frameset>
   <frame name="output" id="output" />
</frameset>

</html>

how does this look so far

just remember the top code is what i am working on

what should i change and add?

suggestions anyone?

hi Folks,

I am new for HTML FRAMES.

I have the code like as shown below.

Code:

<FRAMESET rows="0,*" FRAMEBORDER=0 FRAMESPACING=0 BORDER=0>


			<FRAME SRC="Javascript:parent.getStartupScreen ()" name="RP" scrolling="no"	>


			<FRAMESET rows="0,*,0,8%" FRAMEBORDER=0 FRAMESPACING=0 BORDER=0>


				<FRAME SRC="/jsp/hierarchy/control.jsp" name="cF" scrolling="NO">
				<FRAME SRC="Javascript:parent.getBlank()" name="vF" scrolling="AUTO"> 
				<FRAME SRC="Javascript:parent.getBlank()" name="dF" scrolling="NO"> 
				
				<FRAME SRC="/jsp/resourceplanner/ResourcePlannerFooter.jsp" name="RPF" scrolling="NO">   
			</FRAMESET>
             
	</FRAMESET>

i am currently on "RPF" Frame. I want to refer "RP" Frame loaded "Form" Elements .

Please suggest me .

Thanks...

This seems like it would be so simple and I have absolutely no idea.

I have one page with no frames, and two links on it.

The second page has an iframe on it. Both links on page 1 point to page 2 (which houses the iframe), but based on which link is clicked will determine what that iframe will display.

Basically I need to figure out a way to target the iframe on page 2 after executing a window.open statement. Much like how google images creates a frame at the top after you click on one of the images from the search results.

I've attached two simple files to better explain what I'm trying to do.

FrameSet.zip

I'd appreciate the help, I'm losing my mind.

Hi, im having a problem adding a frame busting killer that counteracts a frame killer script on sites so i can load them inside my iframes..

here is the code i use

<?php
$result = mysql_query("SELECT ru.id, ru.username, ru.owid FROM raidbar_users ru LEFT JOIN raidbar_groups rg ON ru.groupid = rg.id WHERE rg.id = '".(int)$_REQUEST['group']."'") or die(mysql_error());
$myRaidid = raidid();

if(isset($_GET['gm']))
{
echo '<FRAMESET rows="*,*,*,30" frameborder="0">' . "\n";
echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n";
$i = 0;
while($row = mysql_fetch_array($result))
{
if ($i == 2)
{
echo ' </FRAMESET>' . "\n";
echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n";
$i = 0;
}
echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/joinraid.php?raidid=' . $myRaidid . '&suid=' . $row['owid'] . '&serverid='.$siteConfig['userServer'].'">' . "\n";
$i++;
}
echo ' <FRAME src="">' . "\n";
echo ' </FRAMESET>' . "\n";
echo ' <FRAMESET frameborder="0" scrolling="no">' . "\n";
echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . $myRaidid . '">' . "\n";
echo ' </FRAMESET>' . "\n";
echo '</FRAMESET>' . "\n";
}
else
{
echo '<table cellspacing=1 cellpadding=1>' . "\n";
echo '<tr>' . "\n";
$i = 0;
while($row = mysql_fetch_array($result))
{
if ($i == 2)
{
echo '</tr>' . "\n";
echo '<tr>' . "\n";
$i = 0;
}
echo ' <td><iframe src="./acct.php?suid=' . $row['owid'] . '" width=450 height=225 scrolling=no frameborder=0></iframe>' . "\n";
$i++;
}
echo '</tr>' . "\n";
echo '<tr>' . "\n";
echo ' <td><iframe src=http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . raidid() . '&serverid='.$siteConfig['userServer'].' width=250 height=30 scrolling=no></iframe>' . "\n";
echo '</tr>' . "\n";
echo '</table>' . "\n";
}
?>

Now im told to use the following..
<script type="text/javascript">
var prevent_bust = 0
window.onbeforeunload = function() { prevent_bust++ }
setInterval(function() {
if (prevent_bust > 0) {
prevent_bust -= 2
window.top.location = 'http://server-which-responds-with-204.com'
}
}, 1)
</script>

or
var prevent_bust = 0;

// Event handler to catch execution of the busting script.
window.onbeforeunload = function() { prevent_bust++ };

// Continuously monitor whether busting script has fired.
setInterval(function() {
if (prevent_bust > 0) { // Yes: it has fired.
prevent_bust -= 2; // Avoid further action.
// Get a 'No Content' status which keeps us on the same page.
window.top.location = 'http://server-which-responds-with-204.com';
}
}, 1);


But the window.top.location i dont know how to incorporate that to work.

Can anyone help?

I am having trouble I can target two iframe windows at the same time using a Text Link, However I have not found a way to do this using a roll over image. Here is the Two codes I know. Can anyone help me please....


(roll over image) In the <head>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "http://www.midwestfishing.org/pics/01_info_blue.gif";
staticImage1 = new Image();
staticImage1.src = "http://www.midwestfishing.org/pics/01_info_black.gif";
...........................................................
(button)

<a href="info.html" rel="nofollow" target="frame1" onMouseOver="image1.src=loadImage1.src;" onMouseOut="image1.src=staticImage1.src;">
<img name="image1" src="http://www.midwestfishing.org/pics/01_info_black.gif" border=0></a>
...........................................................



(two frames at once text) In the <head>

<script language="javascript">
function loadTwo(iframe1URL, iframe2URL)
{
parent.frame1.location.href=iframe1URL
parent.frame2.location.href=iframe2URL
}
</script>
...........................................................
(button)

<a href="javascript:loadTwo('info.html','home.html')">info</a>



Thanks!

Please take a look at my site at http://purdypoodles.webs.com/index2.html to see what I have set up with frames. I'm looking for code that will allow users to click on "meet the parents" in the top frame, for example, and nicely scroll from the current position in the bottom frame to the Meet the Parents section also in the bottom frame. Then, if the user wants to go to Poodle Facts from there, it'll scroll smoothly from Meet the Parents to Poodle Facts. etc. I got a JS code somewhere, but it doesn't work. Any ideas??

Is there a method for breaking out of frames that's truly cross-browser compatible?

I've seen a ton of examples on how to do this, but I'm not sure which method works the best.

Thanks!

I'm building a webpage using javascript and iframes. Basically I have an iframe in the middle of the index.html page that links to another html page (let's call it iframe.html). My question is, is it possible to call a javascript function from iframe.html to control an object on index.html? If so, how do I do this? I'd like to be able to assign an image in iframe.html with the hyperlink of href="javascript:function()", where the function effects the CSS of a div on index.html.

Thanks

Hello,

I am not the best JS programmer, but I was wondering...

Is there a way to do this:

HTML Document /w/ 2 frames, A & B.

When you click a button in frame A:
"Click" (X,Y coords) in frame B.

If that's not possible in JS, please let me know what language I need.

- Waffles

Hey guys,

I'm using javascript in a menu to change the colour scheme of a page with frames and wondered how I could make this Javascript work across frames. The top frame is the colour picker with the Javascript and the bottom frame is the html template that will be changing colour scheme.

JS:
Code:

var cols = {
  red: [
    { el: '.headertitle',    color: '#FF0000' },
    { el: '#wrapper #maincontent #leftpanel ul.leftnavigation li a.current',       bgcolor: '#FF0000', color: '#FFFFFF' },
    { el: '#wrapper #maincontent #leftpanel',                                      border: '#FF0000' },
    { el: '#wrapper #maincontent #leftpanel ul.leftoffers li div.titlebody a',     color: '#FF0000' },
    { el: '#wrapper #maincontent #editable h2',                                    color: '#FF0000' },
    { el: '#wrapper #maincontent #rightpanel',                                     border:   '#FF0000' },
    { el: '#wrapper #footer',                                                      bgcolor:  '#FF0000' },
	{ el: '#wrapper #maincontent #leftpanel ul.leftoffers li',                     bgcolor:     '#F6D9D9'},
    { el: '.choosecolour',                                                         border:  '#fff' },
    { el: '#cbred',                                                                border:  '#000' }
  ],
  orange: [
    { el: '#header',            bgcolor: '#ff8c10', color: '#ffffff' },
    { el: '#nav li a',       bgcolor: '#d63b18', color: '#ffffff', hoverbgcolor: '#fc6827', hovercolor: '#ffffff' },
    { el: '.primaryBgCol',   bgcolor: '#ff8c10', color: '#ffffff' },
    { el: '.secondaryBgCol', bgcolor: '#f8a955', color: '#ffffff' },
    { el: '.footerBgCol',    bgcolor: '#f2441c' },
    { el: '.footerTextCol',  color:   '#ffffff' },
    { el: '.borderCol',      border:  '#ff8c10' },
		{ el: '#logo',           src:     'images/logo_orange.gif'},
    { el: '.choosecolour',      border:  '#fff' },
    { el: '#cborange',       border:  '#000' }
  ]
};

function changeColour(col) {
  $A(cols[col]).each(function(i) {
    $$(i.el).each(function(j) {
      if (i.bgcolor)
        j.setStyle({ backgroundColor: i.bgcolor });
      
      if (i.color)
        j.setStyle({ color: i.color });
      
      if (i.border)
        j.setStyle({ borderColor: i.border });
      
      if (i.src)
        j.writeAttribute('src', i.src);
      
      // hover colours
      if (i.hovercolor || i.hoverbgcolor) {
        j.onmouseover = function() { this.setStyle({ backgroundColor: i.hoverbgcolor, color: i.hovercolor }); };
        j.onmouseout   = function() { this.setStyle({ backgroundColor: i.bgcolor, color: i.color }); };
      }
    });
  });
}

JS picker HTML code:
Code:

    <div class="colours"> 
        <div class="choosecolour" id="cbred" style="background-color: #c90c12;" onclick="changeColour('red');"></div> 
        <div class="choosecolour" id="cborange" style="background-color: #ff8c10;" onclick="changeColour('orange');"></div>  
    </div>

Anyone know how I can make the colour scheme of page in lower frame change when colour is picked in top page frame?

Hello,

I am making a website with 4 frames lined up vertically. Frame 1 (from the left) is the menuFrame, Frame 2 (mainFrame) is a frame with subcategories/information, Frame 3 (rightFrame) is a frame where some information pops up on a click on one of the subcategories and Frame 4 (rightFrame1) is where a pictures pops up corresponding to the information about the subcategory.

I have been working on getting frame 3 and frame 4 to clear on one click on one of the menu links and I have got it to work using this java script in the head of my frames and framset file:

Quote:
<html>
<head>

<SCRIPT LANGUAGE="JavaScript">
function setFrame(frameName, frameSrc)
{
parent[frameName].location=(frameSrc);
}
</SCRIPT>
</head>
</html>
and links like this in the body section:

Quote:
<a href="javascript:setFrame('mainFrame','information.html');setFrame('rightFrame','blank.html');setFra me('rightFrame1','blank.html')">LINK</a>
I have tried uploading the site to the Internet and when I access it from the computer where I made it, it works like a charm.

The problem is: when I access the website from other computers these java links doesn't work - no information or anything pops up in any of the frames.

Any thoughts on where I could have made an error?


Best Regards,