Home   Notes   Contact Me

JavaScript

Gotcha!

Local

External


Scope of variables


Redirecting to another page on page load


ActiveElement, determining

Note: Use setActive or focus to set which element is active


Screen Width


Popup Confirm


Cookies

More Detailed Cookie Control


Popup Alert


Timer


Controlling another Frame

Layout


+----------------- top (parent)----------------------+

+---------------------+-------------------------------+
|     frames[0]       |         frames[1]             |
|       or            |            or                 |
|  parent.menu_frm    |      parent.index_frm         |
|                     |                               |
+---------------------+-------------------------------+

<frameset cols="150,*">
  <frame name="menu_frm" src="menu.html">
  <frame name="index_frm" src="index.html">
</frameset>

menu_frm controls index_frm


function loadIndex( url)
{
  // ??? Will these work ?? :
  parent.frames[1].location.href = url;
  // alternate method:
  parent.index_frm.location.href = url;
	
	// ??? Or will only these work ?? :
  window.opener.parent.frames[1].location.href = url;
  // alternate method:
  window.opener.parent.index_frm.location.href = url;
  
  // This I have verified:
  // To call an ActiveX controls method in the other frame:
  parent.index_frm.SceneGraphXControl.ProcessCommand("Test 2")
}

Debugging


window.document.form1.Debug.value += "Put text here";

<form name="form1" id="Form11">
	<textarea name="Debug" cols="80" rows="10" id="Textarea2"></textarea>
</form>

Page size, getting it


ActiveX Event Handling

I made an ActiveX control in Visual Studio .NET as follows

I made the html file to test the control look like this:


<!doctype html public
	"-//w3c//dtd xhtml 1.0 transitional//en"
	"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"
>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ATL 7.0 test page for object JbpCon6</title>
</HEAD>
<body>


<object 
	id="JbpCon6" 
	classid="CLSID:807C00B5-0A73-485F-81AC-8630EF2FCD41" 
	viewastext>
</object>

<script language="javascript" for=JbpCon6 event=OnJBP>
<!--
JbpCon6_OnClick()
//-->
</script>

<script id=clientEventHandlersJS language="javascript">
function JbpCon6_OnClick()
{
	alert("hello");
}
</script>

</body>
</HTML>

And the alert box would pop up when I hit the button (after an ActiveX warning box)


Subject


Input Dialog


var retval = prompt("Prompt Box question","Default Value");
alert( "Return value was\n" + retval);

History List


<a href="javascript:history.forward()">Go Forward</A>

<a href="javascript:history.back()">Go Back</A>

My Notes

TopicDetailsexample
mod'ing an applet tag See the comment in the source
mod'ing PARAM (not supported in IE) See comment in source of this page
URL jumping to a new one immediately location.href = location.href + "?size=1024";
Form Variable Manipulation
<form name="anotherName">
<input type=hidden name="hiddenName" value="initial">
</form>

<script language="JavaScript"><!--
document.write(document.anotherName.hiddenName.value+'<br>');
document.anotherName.hiddenName.value = 'hello world';
document.write(document.anotherName.hiddenName.value+'<br>');
//--></script>
String Compare if ( <document.FormName.InputName.value> = = "<theString>" )
Can I click some text next to a radio button to set the radio button to clicked?
<HTML>

<SCRIPT LANGUAGE="JavaScript"><!--
function click(which) {
    document.theForm.theRadio[which].checked = true;
}

//--></SCRIPT>

<FORM NAME="theForm">
<INPUT TYPE="RADIO" NAME="theRadio" CHECKED> <A HREF="javascript:click(0)">Click this</A>
<BR>
<INPUT TYPE="RADIO" NAME="theRadio"> <A HREF="javascript:click(1)">Click this</A>
</FORM>

</HTML>
How can I ensure that one radio button is checked and that the relevant text field is not empty?
<script language="JavaScript"><!--
function validate(what) {
    for (var i=0;i<what.radioButtonName.length;i++) {
        if (what.radioButtonName[i].checked && what.elements['textFieldName' + i].value != '')
            return true;
    }
    alert('You must choose an option, and complete the form field');
    return false;
}
//--></script>

<form name="formName" onSubmit="return validate(document.forms.formName)">
<input type="radio" name="radioButtonName"> <input type="text" name="textFieldName0"><br>
<input type="radio" name="radioButtonName"> <input type="text" name="textFieldName1"><br>
<input type="radio" name="radioButtonName"> <input type="text" name="textFieldName2"><br>
<input type="submit">
</form>
Select, setting its choice
<script language="JavaScript"><!--
function changeSelect(x) {
    document.myForm.mySelect.selectedIndex = x-1;
}
//--></script>

<form name="myForm">
<select name="mySelect">
<option>Option 1
<option>Option 2
<option>Option 3
<option>Option 4
</select>
</form>

<a href="javascript:changeSelect(1)">Change it to 1</a>
<a href="javascript:changeSelect(2)">Change it to 2</a>
<a href="javascript:changeSelect(3)">Change it to 3</a>
<a href="javascript:changeSelect(4)">Change it to 4</a>
Submit button picks where to submit to
<script language="JavaScript"><!--
function sendForm(action,encoding) {
    if (document.images) {
        document.registerForm.action = action;
        document.registerForm.encoding = encoding;
    }
    return true;
}
//--></script>

<form name="registerForm">
<input type="text" name="myText" value="some text">
<input type="submit" value="Submit1"
	onClick="sendForm('/cgi-bin/userform.cgi','text/plain')">
<input type="submit" value="Submit2"
	onClick="sendForm('mailto:someone@somewhere.com','text/plain')">
</FORM>
Integer, casting to parseInt( var);
Submitting a form programmatically
<FORM NAME="formName">
  <INPUT TYPE="BUTTON" ONCLICK="document.formName.submit()">
</FORM>
Rollover button in a form

buttonResetOver = new Image();
buttonResetOver.src = "./reset_over.gif";
buttonResetBase = new Image();
buttonResetBase.src = "./reset.gif";
buttonResetDown = new Image();
buttonResetDown.src = "./reset_down.gif";

<A HREF="javascript:resetValues()" 
	ONCLICK="buttonReset.src = buttonResetDown.src"
	ONMOUSEOVER="buttonReset.src = buttonResetOver.src"
	ONMOUSEOUT="buttonReset.src = buttonResetBase.src">
<IMG SRC="./reset.gif" NAME="buttonReset" BORDER="0" ALT="Reset">
</A>

Mail To test