JavaScript - Javascript Dhtml Scrollbar Problem In Mozilla

Appending to a div (id=right) over time. There is a scrollbar on the right side. At some point, the scrollbar appears but the user has to manually move the scrollbar to the bottom to see the newest appends.

Googled and found a number of "solutions" that I can't get to work. The ideal would be to always have the scrollbar move to the bottom after each append.

Code:

 #right {
    background-color: #FF0;
    width: 150px;
    height: 300px;
    float: right;
    overflow : auto;
  }

$("#right").append("<p>something important here");

Hi,
Can anyone tell me why the following js code fails in Mozilla?
I call the function from:
<tr><td><a href=\"javascript:;\" onClick=\"javascript:ChangeFrame('{$link}')\" ><img src='{$thumbs_fr}' border=0></a></td></tr>

Code:

var ie45,ns6,ns4,dom;
if (navigator.appName=="Microsoft Internet Explorer") ie45=parseInt(navigator.appVersion)>=4;
else if (navigator.appName=="Netscape"){  ns6=parseInt(navigator.appVersion)>=5;  ns4=parseInt(navigator.appVersion)<5;}
dom=ie45 || ns6;

var http=createRequestObject();
var objectId = '';
var loadok = 0;

function createRequestObject(htmlObjectId){
    var obj;
    var browser = navigator.appName;
    
    if(browser == "Microsoft Internet Explorer"){
        obj = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else{
        obj = new XMLHttpRequest();
    }
    return obj;    
}

function sendReq(serverFileName, variableNames, variableValues,objId) {
	var paramString = '';
	
	objectId = objId;
	
	variableNames = variableNames.split(',');
	variableValues = variableValues.split(',');
	
	for(i=0; i<variableNames.length; i++) {
		paramString += variableNames[i]+'='+variableValues[i]+'&';
	}
	paramString = paramString.substring(0, (paramString.length-1));
			
	if (paramString.length == 0) {
	   	http.open('get', serverFileName);
	}
	else {
		http.open('get', serverFileName+'?'+paramString);
	}
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {
	
	if (http.readyState == 4) {
		responseText = http.responseText;
		getobj(objectId).innerHTML = responseText;
    } else {
		getobj(objectId).innerHTML = "<br><div align=center><img src='images/loading.gif' border=0><br>Loading content ...</div>";
	}
		
}

function change_icon(imgDocID,url) {
document.images[imgDocID].src = url;
}  

function showhide(id) {
el = document.all ? document.all[id] :   dom ? document.getElementById(id) :   document.layers[id];
els = dom ? el.style : el;
  if (dom){
    if (els.display == "none") {
        els.display = "";
      } else {
        els.display = "none";
      }
    }
  else if (ns4){
    if (els.display == "show") {
        els.display = "hide";
      } else { 
      els.display = "show";
         }
  }
}

function getobj(id) {
el = document.all ? document.all[id] :   dom ? document.getElementById(id) :   document.layers[id];
return el;
}

function showobj(id) {
obj=getobj(id);
els = dom ? obj.style : obj;
 	if (dom){
	    els.display = "";
    } else if (ns4){
        els.display = "show";
  	}
}

function hideobj(id) {
obj=getobj(id);
els = dom ? obj.style : obj;
 	if (dom){
	    els.display = "none";
    } else if (ns4){
        els.display = "hide";
  	}
}

function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}

function openPopUp(url, windowName, w, h, scrollbar) {
           var winl = (screen.width - w) / 2;
           var wint = (screen.height - h) / 2;
           winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scrollbar ;
		   win = window.open(url, windowName, winprops);
           if (parseInt(navigator.appVersion) >= 4) { 
              	win.window.focus(); 
           } 
}

function thisMovie(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
        return window[movieName]
    }
    else {
        return document[movieName]
    }
}

function sendToFlash () {
	var txt = document.getElementById("inputField").value;
	var txtBold = document.getElementById("txtBold").value;
	var txtItalic = document.getElementById("txtItalic").value;
	var txtColor = document.getElementById("txtColor").value;
	var txtFont = document.getElementById("ls_font").value;
	var txtSize = document.getElementById("ls_size").value;
	getobj('NDKPhoto').sendText(txt,txtFont,txtColor,txtSize,txtBold,txtItalic);
	return false;
}

function ChangeFrame (url) {
	getobj('NDKPhoto').sendFrame(url);
}

function ChangeClipart (url) {
	getobj('NDKPhoto').sendClipart(url);
}

function updateFile(outFile) {
	furl = 'act:savecam|url:'+outFile;
	sendReq('index.php', 'cmd', furl,'cam_result');
	showobj('cam_result');
}

function Show_Select_Color() {
	var newcolor = showModalDialog("select_color.html", "000000", "resizable: no; help: no; status: no; scroll: no; unadorned: no; dialogLeft:400; dialogTop:500;");
    if (newcolor != null) {
		document.getElementById("txtColor").value = newcolor; 
		document.getElementById("cl_pick").src = "pick_color.php?c="+newcolor;
		sendToFlash();
	}
}

function Dao_Gia_Tri(obj) {
	var num = document.getElementById(obj).value;
	if (num!=1) document.getElementById(obj).value = 1;
	else document.getElementById(obj).value = 0;
	sendToFlash();
}

function gotopage(p,cat){  
	change_frame_page(p,cat);
}

function change_frame_page(p,cat) {
	furl = 'act:jsload|sub:frame|p:'+p+'|cat:'+cat;
	sendReq('index.php', 'cmd', furl,'displayFrame');
}

function gotopage_clip(p,cat){  
	change_clip_page(p,cat);
}

function change_clip_page(p,cat) {
	furl = 'act:jsload|sub:clip|p:'+p+'|cat:'+cat;
	sendReq('index.php', 'cmd', furl,'displayClipart');
}

hello Guys ,
Well, i've a BIG Problem With a HUGE JS application , i'm modifying its javaScript code to work on both IE/Mozilla , currently it works fine on IE but not on Mozilla.

My main Point now is events.

lets try with a little module, consider this function :

Code:

function HiliteLectures(Group,Alternatives,ForeColor){
	var i,Lecture,EventLecturesGroup,EventLecturesAlternatives,LecSrcElement
//validate event source    
    if (event.srcElement.id=='Animate'){LecSrcElement=event.srcElement.parentElement}else{LecSrcElement=event.srcElement}
    EventLecturesGroup = Group.split(",")
	EventLecturesAlternatives = Alternatives.split(",")
//hilite Lecture Group with Red as sections
	for(i=0;i<EventLecturesGroup.length;i++){//if item is not selected
		Lecture=document.getElementById(EventLecturesGroup[i])
		if ((EventLecturesGroup[i]!='') & (Lecture!= null)){
	        Lecture.style.borderColor='red';
	        Lecture.style.borderWidth=2
	        if (Lecture.style.zIndex != 1000){Lecture.style.zIndex=120} //skip obligatory zIndexes
		}
	}
//hilite Lecture Alternatives with blue as Lectures
	for(i=0;i<EventLecturesAlternatives.length;i++){//if item is not selected
		Lecture=document.getElementById(EventLecturesAlternatives[i])
		if ((EventLecturesAlternatives[i]!='') & (Lecture != null)){
		    if (EventLecturesAlternatives[i]!=''){
			    Lecture.style.borderColor='blue';
			    Lecture.style.borderWidth=2
			    if (Lecture.style.zIndex != 1000){Lecture.style.zIndex=120} //skip obligatory zIndexes
		    }
		}
	}
//Put the current lecture forecolor to ForeColor
    LecSrcElement.style.backgroundColor=ForeColor;
}

and it is attached in this place like :

Code:

temp.onmouseover=new Function("HiliteLectures('"+Lecture.Group+"','"+Lecture.Alternatives+"','"+Day.HiliteColor+"');")

this works fine in IE , i want to modify it to work on Mozilla , Any Help ??

Hi, I'm having a problem with a website I'm creating for christmas, in my family we always write santa claus letters but with a tricky side to it. So I decided to make questions on a website, the problem is that when the correct answer is given the javascript alert that is supposed to tell the user something appears and disappears without interaction from the user. I need the user to have to click OK.

By the way, this only happens when using Mozilla.

Hello! I am trying to collapse a table via JS, and the following code works in IE, yet not in Mozilla. I have read lots of other posts (on the world wide web) in regards to possibly tackling this with div, or span: however, in my case, I cannot modify the already existing HTML of the code.

Could you please assist me - why is it that the following code works in IE, yet not in Mozilla?

More INFO: Please note that although I am using the variable id below, I have also tried this via the defined element el. However -- using el doesn't work in either browsers. Please also note that the function is being called like so:

HTP.p(
'<table BORDER=0 BORDERCOLOR="#d1dce9" CELLPADDING="0" WIDTH=100% style="border-collapse:collapse;">
<tr>
<td onClick="ftoggle(this);" width="100%" style="cursorointer;"><font face="Calibri" color ="#3A5894" size=2><B>[+] Click here to Show/Hide the Table</B></font></td>
</tr><tr>
<td colspan="1" style="display:none;color:#ff0000;">');

<head>
<script language="JavaScript">

function ftoggle(id){
var el = document.getElementById(id);
if(id.parentNode.nextSibling.childNodes.item(0).style.display=="")
{
id.parentNode.nextSibling.childNodes.item(0).style.display="none";
}
else {
id.parentNode.nextSibling.childNodes.item(0).style.display="";
}
}

</script>
</head>');

Hi All,

This is my first post in this forum. I am relatively new to javascript. Hope I get some guidance here. Also I would like to contribute here when I get little expertise on javascript.

I have developed following snippet of code, which is working very well with firefox 6.0. But when it comes to IE 8.0, it just does not work.

Quote:
<SCRIPT LANGUAGE="JavaScript">
function refreshFrame() {
frames['top'].window.location.href = "report.php?parent_id=<? echo $parent_id; ?>";
}
</script>
</head>

<?
include('style.php');
include('PHP_functions.php');

print("
<FRAMESET rows='96,100' onLoad=refreshFrame() BORDERCOLOR=blue BORDER=0>
<FRAME SRC=blank.html SCROLLING=NO NORESIZE NAME=top>
<FRAME SRC=manage.php?view=show_all&parent_id=$parent_id NAME=bottom>
</FRAMESET>
");
?>
</HTML>
In the above script, I am trying to load the frame top after loading frame bottom, as the latter takes more time to load due to some processing involved. Till frame bottom is under processing stage, I display a message "Processing Please wait" which is coming from blank.html.

Working under Firefox:

It loads blank.html first and displays the message as "processing please wait". Once frame bottom has completed the processing it displays its contents at second half of the webpage. Then finally frame top gets loaded on first half of the web page. This is the expected result. Here URL does not change as the URL remains same as before "http://xyz.com/index.html"

Not Working under IE
It loads blank.html first and displays the message as "processing please wait". Once frame bottom has completed the processing it displays its contents at second half of the webpage. Then finally frame top gets loaded on whole page instead of first half of the page. Here URL changes to complete new URL as "http://xyz.com/report.php?parent_id"

Can anyone please suggest what could be reason for this.

Thanks,
Vinay

I'm back from a web dev hiatus. I'm writing a new site but have found myself a bit rusty. I'm trying to change the visibility of an element with no luck. nothing happens. I'll supply the code. Don't lick the kitten. My js is external. Any non-condescending help is welcome.

html
Code:

    <div id="windows"><p>Windows</p>
        <a name="windowsitem">test1</a>
        <a>test2</a>
</div>

javascript a.k.a js (js stands for whispering ponies)
Code:

function filter()
{
    if ( windowscb.checked==1 )
        windowsitem.style.visibility='visible';
    else
        windowsitem.style.visibility='hidden';
}

If Ashton Kutcher is reading this, I should be married to Demi Moore. Not you!!

sorry if this is in the wrong place, but it does include js and ajax.

hi all,

ive downloaded the DHTML window script from here :

http://www.dynamicdrive.com/dynamici...ndow/index.htm

and have it running on my site.

i also have a DTHML / ajax chat running on the site which is currently on the main page in an iframe. im trying to put this iframe inside the DHTML window, i have tried all 4 of the window types and for each one i either get the items in the directory or the source code eg

if i put the link as test/ i get the list of files in that directory, if i put test/index.php i get <php? source code blah blah ?>

it works fine with .html files i assume its because they are .php ?

any ideas ?

thanks

I have some code that creates a DHML window, I'll call that code MyDHTMLWin .

Now what happens is I create a new MyDHTMLWin object and what happens inside that is it creates an iFrame. Now in my init method I do this..

this.iFrameObj.dhtmlWinObj = this;

What I what to do is from inside the file loaded in the iFrame is be able to get the object that opened the window. I did used to do var newWin = new dhtmlWinObj(....); and then parent.newWin.anything() but this is no longer fit for purpose as I reuse this code and the variable names will change. But no matter what I try I just can't seem to get that object that should be stored in the iFrames dhtmlWinObj attribute.

I thought it would be this.dhtmlWinObj but that doesn't work

How can I get the object that opened my DHTML window???

TIA,
Dale

Hey, I am having some difficulties and wondered if anyone could help, i have created a keyboard that works and inputs the values pressed into a text box, i have then tried to expand on this and create a keyboard with multiple layouts that dynamically change when a button is pressed, i have done this by having an iframe within the page and calling the parent function but it will no longer input the text into the textbox. The CSS styling also works in Safari but won't on firefox, any help would be much appreciated

Here is my code:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type='text/javascript'>

function addtotextbox(i)
{
if(document.getElementById('keyboardsearchbox').value.length==0)
var node = document.getElementbyId('keyboard').document.getElementById(i).firstChild.nodeValue
else
node = document.getElementbyId('keyboard').document.getElementById(i).firstChild.nodeValue.toLowerCase()
if(node == "space")
document.getElementbyId('keyboard').document.getElementById("keyboardsearchbox").value += " "
else
document.getElementbyId('keyboard').document.getElementById('keyboardsearchbox').value += node
}


function resettext()
{
document.getElementById('keyboardsearchbox').value = ""
}


function backspace(){
var currentvalue=document.getElementById("keyboardsearchbox").value
var newvalue=currentvalue.substr(0,currentvalue.length-1)
document.getElementById("keyboardsearchbox").value=newvalue
}



var keyboardstyle='<html><head><style type="text/css">.orangebox{background-color:#F60;}.keyboard {font-family: Arial, Helvetica, sans-serif;text-align:center;font-size: 25px;font-weight: bold;color: #000;background-color: #F60;}.keyboard:hover {font-family: Arial, Helvetica, sans-serif;text-align:center;font-size: 25px;font-weight: bold;color: #000;background-color: #F90;}body {margin-left: 0px;margin-top: 0px;}.textboxstyle {font-family:Arial, Helvetica, sans-serif;font-size:20px;font-weight:normal;color:#F60;}</style></head><body>'

function qwerty(){
var style=keyboardstyle
var s= style + '<table width="900" border="1" cellpadding="0" cellspacing="0" class="borderbox"><tr><td><table border="0" cellpadding="0" cellspacing="1"><tr><td width="90" align="center" class="keyboard" id="1" onclick="parent.addtotextbox(this.id)">1</td><td width="90" align="center" class="keyboard" id="2" onclick="parent.addtotextbox(this.id)">2</td><td width="90" align="center" class="keyboard" id="3" onclick="parent.addtotextbox(this.id)">3</td><td width="90" align="center" class="keyboard" id="4" onclick="parent.addtotextbox(this.id)">4</td><td width="90" align="center" class="keyboard" id="5" onclick="parent.addtotextbox(this.id)">5</td><td width="90" align="center" class="keyboard" id="6" onclick="parent.addtotextbox(this.id)">6</td><td width="90" align="center" class="keyboard" id="7" onclick="parent.addtotextbox(this.id)">7</td><td width="90" align="center" class="keyboard" id="8" onclick="parent.addtotextbox(this.id)">8</td><td width="90" align="center" class="keyboard" id="9" onclick="parent.addtotextbox(this.id)">9</td><td width="90" align="center" class="keyboard" id="0" onclick="parent.addtotextbox(this.id)">0</td></tr><tr><td id="q" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Q</td><td id="w" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">W</td><td width="90" align="center" class="keyboard" id="e" onclick="parent.addtotextbox(this.id)">E</td><td id="r" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">R</td><td id="t" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">T</td><td id="y" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Y</td><td id="u" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">U</td><td id="i" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">I</td><td id="o" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">O</td><td id="p" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">P</td></tr><tr><td id="space" width="90" rowspan="2" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">space</td><td id="a" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">A</td><td id="s" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">S</td><td id="d" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">D</td><td id="f" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">F</td><td id="g" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">G</td><td id="h" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">H</td><td id="j" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">J</td><td id="k" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">K</td><td id="l" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">L</td></tr><tr><td align="center" valign="middle" bgcolor="#F60" id="box1"></td><td align="center" valign="middle" bgcolor="#F60" id="box2"></td><td id="z" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Z</td><td id="x" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">X</td><td id="c" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">C</td><td id="v" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">V</td><td id="b" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">B</td><td id="n" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">N</td><td id="m" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">M</td></tr></table></td></tr></table></body></html>'

with(document.getElementById('keyboard').contentDocument){
open()
write(s)
close()
}
}

function dorvak(){
var style=keyboardstyle
var s= style + '<table width="900" border="1" cellpadding="0" cellspacing="0" class="borderbox"><tr><td><table border="0" cellpadding="0" cellspacing="1"><tr><td width="90" align="center" class="keyboard" id="1" onclick="parent.addtotextbox(this.id)">1</td><td width="90" align="center" class="keyboard" id="2" onclick="parent.addtotextbox(this.id)">2</td><td width="90" align="center" class="keyboard" id="3" onclick="parent.addtotextbox(this.id)">3</td><td width="90" align="center" class="keyboard" id="4" onclick="parent.addtotextbox(this.id)">4</td><td width="90" align="center" class="keyboard" id="5" onclick="parent.addtotextbox(this.id)">5</td><td width="90" align="center" class="keyboard" id="6" onclick="parent.addtotextbox(this.id)">6</td><td width="90" align="center" class="keyboard" id="7" onclick="parent.addtotextbox(this.id)">7</td><td width="90" align="center" class="keyboard" id="8" onclick="parent.addtotextbox(this.id)">8</td><td width="90" align="center" class="keyboard" id="9" onclick="parent.addtotextbox(this.id)">9</td><td width="90" align="center" class="keyboard" id="0" onclick="parent.addtotextbox(this.id)">0</td></tr><tr><td id="q" width="90" align="center" bgcolor="#F60" > </td><td id="w" width="90" align="center" bgcolor="#F60"> </td><td width="90" align="center" bgcolor="#F60" id="e" > </td><td id="p" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">P</td><td id="y" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Y</td><td id="f" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">F</td><td id="g" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">G</td><td id="c" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">C</td><td id="r" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">R</td><td id="l" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">L</td></tr><tr><td id="a" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">A</td><td id="o" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">O</td><td id="e" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">E</td><td id="u" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">U</td><td id="i" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">I</td><td id="d" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">D</td><td id="h" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">H</td><td id="t" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">T</td><td id="n" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">N</td><td id="s" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">S</td></tr><tr><td id="space" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">space</td><td id="q" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Q</td><td id="j" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">J</td><td id="k" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">K</td><td id="x" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">X</td><td id="b" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">B</td><td id="m" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">M</td><td id="w" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">W</td><td id="v" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">V</td><td id="z" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Z</td></tr></table></td></tr></table></body></html>'

with(document.getElementById('keyboard').contentDocument){
open()
write(s)
close()
}
}


function alphabet(){
var style=keyboardstyle
var s= style + '<table width="900" border="1" cellpadding="0" cellspacing="0" class="borderbox"><tr><td><table border="0" cellpadding="0" cellspacing="1"><tr><td width="90" align="center" class="keyboard" id="a" onclick="parent.addtotextbox(this.id)">A</td><td width="90" align="center" class="keyboard" id="b" onclick="parent.addtotextbox(this.id)">B</td><td width="90" align="center" class="keyboard" id="c" onclick="parent.addtotextbox(this.id)">C</td><td width="90" align="center" class="keyboard" id="d" onclick="parent.addtotextbox(this.id)">D</td><td width="90" align="center" class="keyboard" id="e" onclick="parent.addtotextbox(this.id)">E</td><td width="90" align="center" class="keyboard" id="f" onclick="parent.addtotextbox(this.id)">F</td><td width="90" align="center" class="keyboard" id="g" onclick="parent.addtotextbox(this.id)">G</td><td width="90" align="center" class="keyboard" id="h" onclick="parent.addtotextbox(this.id)">H</td><td width="90" align="center" class="keyboard" id="i" onclick="parent.addtotextbox(this.id)">I</td><td width="90" align="center" class="keyboard" id="j" onclick="parent.addtotextbox(this.id)">J</td></tr><tr><td id="k" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">K</td><td id="l" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">L</td><td width="90" align="center" class="keyboard" id="m" onclick="parent.addtotextbox(this.id)">M</td><td id="n" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">N</td><td id="o" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">O</td><td id="p" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">P</td><td id="q" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Q</td><td id="r" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">R</td><td id="s" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">S</td><td id="t" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">T</td></tr><tr><td id="space" width="90" rowspan="2" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">space</td><td id="u" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">U</td><td id="v" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">V</td><td id="w" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">W</td><td id="x" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">X</td><td id="y" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Y</td><td id="z" width="90" align="center" class="keyboard" onclick="parent.addtotextbox(this.id)">Z</td><td id="z" bgcolor="#F60" width="90" align="center"></td><td id="k" width="90" align="center" bgcolor="#F60" ></td><td id="l" width="90" align="center" class="keyboard" ></td></tr><tr><td align="center" valign="middle" bgcolor="#F60" id="box1"></td><td align="center" valign="middle" bgcolor="#F60" id="box2"></td><td id="z" width="90" align="center" bgcolor="#F60" ></td><td id="x" width="90" align="center" bgcolor="#F60" ></td><td id="c" width="90" align="center" bgcolor="#F60" ></td><td id="v" width="90" align="center" bgcolor="#F60" ></td><td id="b" width="90" align="center" bgcolor="#F60" ></td><td id="n" width="90" align="center" bgcolor="#F60" ></td><td id="m" width="90" align="center" bgcolor="#F60" ></td></tr></table></td></tr></table></body></html>'

with(document.getElementById('keyboard').contentDocument){
open()
write(s)
close()
}
}



</script>


<style type="text/css">
.titles {
font-family:Arial, Helvetica, sans-serif;
text-align:center;
font-size:18px;
font-weight:bold;
color:#F60;
background-color:#FFF;
}

.textboxstyle {
font-family:Arial, Helvetica, sans-serif;
font-size:20px;
font-weight:normal;
color:#F60;
}

.borderbox {
border: #666;
}

.borderboxorange {
border:#666;
background-color:#F60;
}

body {
margin-left: 0px;
margin-top: 0px;
}
</style>
</head>

<body>
<table width="900" border="1" cellpadding="0" cellspacing="0" class="borderbox">
<tr>
<td><table width="900" border="0" cellpadding="0" cellspacing="1">
<tr>
<td width="403" height="30" colspan="3" align="center" valign='middle' bgcolor="#F60" id="textbox"><form id="form1">
<input name="keyboardsearchbox" type="text" class="textboxstyle" id="keyboardsearchbox" size="70"/>
</form></td>
<td width="150" align="center" valign='middle' bgcolor="#F60" id="textbox"><input type="submit" name="reset"
id="reset" value=" Reset " onclick="resettext()" /></td>
</tr>
<tr>
<td height="30" align="center" valign='middle' bgcolor="#F60" id="reset"><input type="submit" name="qwerty"
id="qwertybutton" value=" Qwerty " onclick="qwerty()" /></td>
<td align="center" valign='middle' bgcolor="#F60" id="qwerty"><input type="submit" name="dorvak"
id="dorvakbutton" value=" Dorvak " onclick="dorvak()" /></td>
<td align="center" valign='middle' bgcolor="#F60" id="dorvak"><input type="submit" name="alphabet"
id="alphabetbutton" value=" alphabet " onclick="alphabet()" /></td>
<td align="center" valign='middle' bgcolor="#F60" id="alphabet"><input type="submit" name="backspace"
id="backspace" value=" backspace " onclick="backspace()" /></td>
</tr>
<tr>
<td height="30" colspan="4" align="center" valign='middle' id="iframe"><iframe id='keyboard' width='900'></iframe></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>


Thanks!
Joe

Scroll down to the bottom. Click on an "X" button to bring up a DHTML popup. Select an item. When the DHTML closes and the original HTML is updated the browser scrolls to top. Is there a way to stop this by wrapping it somehow in a container, since you can't stop the scroll event? Code:

<html>
<head>
	<title> Vendor Management</title>
</head>
<body>
<table border="0"  width="100%">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="2" align="left" valign="top">
	<img src=""/>
</td>
<td><img src=""/></td>
</tr>
<tr>
<td align="left" valign="top">
			<a href=""/></a>
			<a href=""/></a>
			<a href=""/></a>
</td>
<td align="left">
	<img src=""/>
</td>
<td>
	<img src=""/>
</td>
</tr>
<tr>
<td>
	<span class="pageHeading" align="left">
		Web Administrator
	</span>
</td>
</tr>
</table>
<br/>
<form name="form" method="post" action="">
<table width="100%">
	<tr>
	<td width="5%"></td>
	<td align="left">
		<p class="filter">
		 All<br/>
		All<br/>
		</p>
	</td>
	<td>
		<table width="40%"  border="1" >
		<tr>
			<td class="h" colspan="2">Color Key </td>
		</tr>
		<tr>
			<td class="S "> </td><td class="small">The  is being negotiated.  The administrator may finalize the  when it is complete.</td>
		</tr>
		<tr>
			<td class="SAVA">Awaiting Vendor Approval </td><td class="small">The  has been finalized and is waiting for the Vendor to sign it.</td>
		</tr>
		<tr>
			<td class="SLocked">Locked</td><td class="small">The  has been finalized and signed.  All the Locked items in the  will be in the show.</td>
		</tr>
		</table>
	</td>
	</tr>
	<tr>
		<td colspan="3">
		<table align="center">
			<tr>
				<td>Search:</td>
				<td>
					<input	name="searchValue" id = "searchValue" type="text" size="24" value="">
				</td>
				<td>
					By
				</td>
				<td>
					<select name="searchColumn" id="searchColumn">
						<option value="VENDOR_NAME" SELECTED> Vendor Name</option>
						<option value="VENDOR_NUMBER" > Vendor Number</option>
					</select>
				</td>
				<td>
					And
				</td>
				<td>
					<select name="searchQualifier" id="searchQualifier">
						<option value="CONTAINS" SELECTED>Contains</option>
						<option value="STARTS_WITH" >Starts With</option>
						<option value="ENDS_WITH" >Ends With</option>
					</select>
				</td>
				<td>
					<input type="button" name="SearchButton" id="SearchButton" value="Search" onClick="onVendorSearch()">
				</td>
				<td>
					<input type="button" name="ClearSearchButton" id="ClearSearchButton" value="Clear" onClick="onVendorClear()">
				</td>
			</tr>
		</table>
		</td>
</table>
<table width="90%" align="center" >
	<tr align="center">
		<td colspan="3">
		<br>
			<input name="reference" type="hidden" value="viewVendorUsersCheck">
			<input name="action" type="hidden" value="delete">
		</td>
	</tr>
</table>
	<table id="results" width="100%" border="1"  style="border-color:black" align="left">
<!-- START OF DATA -->			
		<tr class="S ">
			<td> <a name="">005890</a></td>
			<td> Ivy-Dry, Inc</td>
			<td>  </td>
			<td>     </td>
			<td>
				<table>
		<tr>
			<td>
							<input type="text" 
								   id="vendorBooth_005890"
								   name="vendorBooth_005890"
								   
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_005890"
								   id="vendorBoothBtn_005890"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>
				<a href=""> </a>
			</td>
			<td>8</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20141</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="006867">006867</a></td>
			<td> Pacific World Corporation</td>
			<td>  </td>
			<td>     </td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_006867"
								   name="vendorBooth_006867"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_006867"
								   id="vendorBoothBtn_006867"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20154</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">006952</a></td>
			<td> Prince Of Peace Enterprises</td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_006952"
								   name="vendorBooth_006952"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_006952"
								   id="vendorBoothBtn_006952"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20155</td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">006996</a></td>
			<td> Bayer ,   Division</td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_006996"
								   name="vendorBooth_006996"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_006996"
								   id="vendorBoothBtn_006996"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>21</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20156</td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007003</a></td>
			<td> Kerr Group, Inc. / Kerr </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007003"
								   name="vendorBooth_007003"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007003"
								   id="vendorBoothBtn_007003"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>92</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20157</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007010</a></td>
			<td> Unilever</td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007010"
								   name="vendorBooth_007010"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007010"
								   id="vendorBoothBtn_007010"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>160</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20158</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007057</a></td>
			<td> Pfizer  </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007057"
								   name="vendorBooth_007057"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007057"
								   id="vendorBoothBtn_007057"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>9</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20159</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007060</a></td>
			<td> Johnson & </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007060"
								   name="vendorBooth_007060"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007060"
								   id="vendorBoothBtn_007060"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>71</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20160</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007112</a></td>
			<td> Colgate-Palmolive </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007112"
								   name="vendorBooth_007112"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007112"
								   id="vendorBoothBtn_007112"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>39</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007120</a></td>
			<td> W.F. Young, </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007120"
								   name="vendorBooth_007120"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007120"
								   id="vendorBoothBtn_007120"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20162</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007120</a></td>
			<td> W.F. Young, </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007120"
								   name="vendorBooth_007120"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007120"
								   id="vendorBoothBtn_007120"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>
				<a href=""> </a>
			</td>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20162</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007120</a></td>
			<td> W.F. Young, </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007120"
								   name="vendorBooth_007120"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007120"
								   id="vendorBoothBtn_007120"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20162</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="">007120</a></td>
			<td> W.F. Young, </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007120"
								   name="vendorBooth_007120"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007120"
								   id="vendorBoothBtn_007120"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>
			</td>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td></td>
			<td>
			</td>
			<td>
			</td>
			<td> </td>
			<td></td>
		</tr>		
		<tr class="S ">
			<td> <a name="">007167</a></td>
			<td> 3M   </td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_007167"
								   name="vendorBooth_007167"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_007167"
								   id="vendorBoothBtn_007167"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>0</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20163</td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="S ">
			<td> <a name="008877">008877</a></td>
			<td> x  Brands</td>
			<td></td>
			<td></td>
			<td>
				<table>
		<tr>
						<td>
							<input type="text" 
								   id="vendorBooth_008877"
								   name="vendorBooth_008877"
								   readonly
								   title="" />
						</td>
						<td>
							<input type="button" 
								   value="X"
								   name="vendorBoothBtn_008877"
								   id="vendorBoothBtn_008877"
								   onclick="DCCshowBoothList(this.id)"
						</td>
					</tr>
				</table>
			<td>3</td>
			<td>0</td>
			<td>0</td>
			<td></td>
			<td>20168</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr align="center" bgcolor="9999FF" class="e">
			<td></td>
		</tr>
		<tr bgcolor="9999FF" class="h">
			<td colspan="11" class="h"> Vendor Users and s: </td>
			<td class="h" align="center"><input type="submit" name="Submit" value="Submit"></td>
			<td colspan="4" class="h"></td>
		</tr>
	</table>
<script type="text/javascript">
	window.onload = function () {
			DCCinitPage();
	};
	function DCCinitPage() {
		var IE = document.all?true:false;
		if (!IE) document.captureEvents(Event.MOUSEDOWN);
		document.onmousedown = DCCmousePosition;
	}
function DCCmousePosition(e) {
		var IE = document.all?true:false;
		var tempX = 0;
		var tempY = 0;
		if (IE) { 
				tempX = event.clientX + document.body.scrollLeft;
				tempY = event.clientY + document.body.scrollTop;
		} else {
				tempX = e.pageX;
				tempY = e.pageY;
		}  
		if (tempX < 0){tempX = 0;}
		if (tempY < 0){tempY = 0;}  
		DCCmouse.setLeft(tempX);
		DCCmouse.setTop(tempY);
		return true;
}
function DCCmouseClass() {
		this.left = 0; 
		this.top = 0;
		this.setLeft = function (left) { this.left = left; }
		this.getLeft = function() { return this.left; }
		this.setTop = function (top) { this.top = top; }
		this.getTop = function() { return this.top; }
}
var DCCmouse = new DCCmouseClass(); 
function DCCshowBoothList(thisId) {
	var indexOfNumber = thisId.indexOf("vendorBoothBtn_");
	var thisNumber = thisId.substring(indexOfNumber + 15);
	document.forms[0].tempVendorNumber.value = thisNumber;
	document.getElementById("DCCboothList").style.top = (DCCgetWindowTop() + 20) + "px";
	document.getElementById("DCCboothList").style.left = (DCCmouse.getLeft() + 15) + "px";
	document.getElementById("DCCboothList").style.display="";
}
function DCCcloseBoothList() {
	document.getElementById("DCCboothList").style.display="none";
}
function DCCboothSelected(boothId) {
	document.getElementById("DCCboothList").style.display="none";
	var indexOfNumber = boothId.indexOf("boothNumber_");
	var indexOfIndex = boothId.indexOf("index_");
	var indexOfName = boothId.indexOf("name_");
	var boothNumber = boothId.substring(indexOfNumber + 12, indexOfIndex);
	var boothIndex = boothId.substring(indexOfIndex + 6, indexOfName);
	var boothName = boothId.substring(indexOfName + 5);
	var vendorNumber = document.getElementById("tempVendorNumber").value;
	var displayBoothNumber = "vendorBooth_" + vendorNumber;
	document.getElementById(displayBoothNumber).value = boothNumber;
	document.getElementById(displayBoothNumber).name = displayBoothNumber + "_dirty";
	document.getElementById(displayBoothNumber).title = boothName;
}
function DCCgetWindowTop() {
	var winTop = 0;
	if( typeof( window.pageYOffset ) == 'number' ) {
		winTop = window.pageYOffset;
	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		winTop = document.body.scrollTop;
	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		winTop = document.documentElement.scrollTop;
	}
	return winTop;
}
function DCCgetWindowLeft() {
	var winLeft = 0;
	if( typeof( window.pageXOffset ) == 'number' ) {
		winLeft = window.pageXOffset;
	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		winLeft = document.body.scrollLeft;
	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		winLeft = document.documentElement.scrollLeft;
	}
	return winLeft;
}
</script>
<style>
	.DCChiglightHover:hover {
		background-color: rgb(200,200,200);
	}
</style>
<div id="DCCboothList"
	style="
	position: absolute;
	top: 200px;
	left: 350px;
	height: 360px;
	width: 300px;
	background-image: url(/DCC5/pages/shared/images/transp.gif);
	display: none;
	">
	<input type="hidden" name="tempVendorNumber" id="tempVendorNumber" value="" />
	<p align="right" style="padding: 0; margin: 0;">
		<input style="height: 18px;
					  width: 20px;
					  background-image: url(dummy.gif);
					  border-top: 1px solid rgb(210,210,210);
					  border-left: 1px solid rgb(210,210,210);
					  border-right: 1px solid rgb(210,210,210);
					  border-top: 0px solid rgb(210,210,210);
					  color: rgb(210,0,0);"
			   type="button"
			   id="closeBoothList"
			   name="closeBoothList"
			   value ="X"
			   onclick="DCCcloseBoothList()" />
	</p>
<div id="DCCboothListInner"
		 style="background: rgb(240,240,240);
				border: 1px solid rgb(130,130,130);
				height: 334px;
				overflow: auto; ">
		<p style="padding: 0; margin: 0">
			<a href="" class="DCChiglightHover"
						id="boothNumber_D010index_0name_Beef Booth"
						style="text-decoration: none; color: black;"
						onclick="DCCboothSelected(this.id)">D010Beef Booth</a>
		</p>
		<p style="padding: 0; margin: 0">
			<a href="" class="DCChiglightHover"
						id="boothNumber_D006index_1name_DCC Test Booth D006"
						style="text-decoration: none; color: black;"
						onclick="DCCboothSelected(this.id)">D006DCC Test Booth D006</a>
		</p>
		<p style="padding: 0; margin: 0">
			<a href="" class="DCChiglightHover"
						id="boothNumber_D005index_2name_DCC Test Booth D005"
						style="text-decoration: none; color: black;"
						onclick="DCCboothSelected(this.id)">D005DCC Test Booth D005</a>
		</p>
		<p style="padding: 0; margin: 0">
			<a href="" class="DCChiglightHover"
						id="boothNumber_D004index_3name_DCC Test Booth D004"
						style="text-decoration: none; color: black;"
						onclick="DCCboothSelected(this.id)">D004DCC Test Booth D004</a>
		</p>
		<p style="padding: 0; margin: 0">
			<a href="" class="DCChiglightHover"
						id="boothNumber_269index_92name_ARCHTECH"
						style="text-decoration: none; color: black;"
						onclick="DCCboothSelected(this.id)">269ARCHTECH</a>
		</p>
	</div>
</div>

<!-- End code for custom booth list drop down -->
 </form>
    </body>

</html>

NOTE:
If you are tempted to respond "validate your code" or some other useless response, save your breath. This is a real world problem. The code is an fragment output from a JSP. I don't have the luxury of updating 2000 jsp files to make it up to standard.

Hello:
I have a Fire Fox 3.5.2 error console message regarding a DHTML script:
Error: uncaught exception: [Exceptions: ... "Not enough arguments" nsresult
"0x8057001 (NS_ERROR_XPC_NOT_ENOUGH_ARGS)" Location: "JS frame :: (file path) upHandler :: line 102" no data]

The line referenced is:
document.removeEventListener('mouseup', upHandler);

It is part of a drag function that is applied to a container div.

I have successfull used this code block, copied from Orielly's Javascript:
The Definitive Guide, 4th Edition in another project.

The only real difference is that the code in the working use is div tags hard coded. In the one giving me problems, the div tags are written using document.write() in a function that is called in the body of the document when the page loads.
I could supply the code context, but it is several hundred lines.
The project is not available at present on the web to surf to but the
one project that works is
jekillen.com/jekillen/content/web_design/OOP_panel/test_OOP_DEV_ALT.php
The code in question is 'beginDrag'. There is a panel called fortune cookie
which the user can drag, and a panel called 'Advisory' that the user can also
drag around after clicking button labeled 'message'.
Any info, suggestions, advice?
Thanks in advance.
Jeff K

this is my DHTML Flashcard App that i'm working on. And it seems to work alright so far. For some reason when i am writing the data to the local disk, it is not writing the UTF8 character correctly. It's just substituting a Comma in it's place. So this is causing a significant problem for displaying chinese language characters in the data file.
I am using Notepad++ for writing my code, and when i manually write chinese characters into the code, they display correctly, but it seems to not be working when JavaScript does the writing.

Any ideas?

here's my code:

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<script language="javascript">
// Set Global Variables

var Know = 0;
var DontKnow = 0;
var CurrentCard = 0;
var ChineseCard = new Array();
var PinYinCard = new Array();
var EnglishCard = new Array();
var NumberOfCards = 0;
var DataFile = "C:" + String.fromCharCode(92) + "FlashCard.txt";
var Delimeter = ",";
var EndOfRecordTerminationCharacter = ".";

function init()
{
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
 document.getElementById("MainMenu").style.visibility = "visible";
}

function ShowPlayer()
{
 document.getElementById("FlashCardPlayer").style.visibility = "visible";
 document.getElementById("MainMenu").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
 LoadFlashCard();
}

function ShowEditor()
{
 document.getElementById("FlashCardEditor").style.visibility = "visible";
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("MainMenu").style.visibility = "hidden";
}

function ShowMain()
{
 document.getElementById("MainMenu").style.visibility = "visible";
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
}

function btnClickShowPinYin()
{
 document.getElementById("PinYin").value = PinYinCard[CurrentCard];
}


function btnClickShowEnglish()
{
 document.getElementById("English").value = EnglishCard[CurrentCard];
}

function ClearEditor()
{
 // Clear all the text boxes in the editor
 document.getElementById("EditChinese").value = "";
 document.getElementById("EditPinYin").value = "";
 document.getElementById("EditEnglish").value = "";
}

function WriteDataOld()
{
 // Conicate the Record data
 var WriteData = document.getElementById("EditChinese").value  + Delimeter + 
 document.getElementById("EditPinYin").value  + Delimeter +
 document.getElementById("EditEnglish").value + EndOfRecordTerminationCharacter + "\n";
 
  // Load the data file's current contents
 var OldData = LoadFromDisk(DataFile);
 
 var AppendData = OldData + WriteData + "\n";
 
 // Write the data to the file
 SaveToDisk(DataFile, AppendData);
 
 // Clear the TextBoxes to prepare for the next entry
 ClearEditor();
}

 var Records = new Array();
 var Elements = new Array();

function WriteData()
{
 // Conicate the Record data
 var WriteData = document.getElementById("EditChinese").value  + Delimeter + 
 document.getElementById("EditPinYin").value  + Delimeter + 
 document.getElementById("EditEnglish").value + "\r";
 
 // Load the data file's current contents
 var OldData = LoadFromDisk(DataFile);
 
 if (OldData == null)
    {
	 // The file was blank, so don't try to append null content data
	 SaveToDisk(DataFile, WriteData + "\n");
	}
	else
	{
	 var AppendData = OldData + WriteData + "\n";
     // Write the data to the file
     SaveToDisk(DataFile, AppendData);
	}
 
 // Clear the TextBoxes to prepare for the next entry
 ClearEditor();
}

var Records = new Array();
  
function LoadFlashCard()
{
 // Load the FlashCard Information from the DataFile into the Arrays
 LoadData = LoadFromDisk(DataFile);
 
 Records = LoadData.split(",");
 
 // Load the Elements in to the   ChineseText, PinYin, and English   Arrays
 
 NumberOfCards = 3 / Records.length;
 
 // Load the Chinese Characters             "12, 123, 1234, 12345, 123456, 1234567
 var Ptr = 0;
  for (var x = 0; x < Records.length; x = x + 3)
     {
	  ChineseCard[Ptr] = Elements[x];
	  Ptr++;
	 }
	 
 Ptr = 0;
 // Load the PinYin
  for (var x = 1; x < Records.length; x = x + 3)
     {
	  PinYinCard[Ptr] = Elements[x];
	  Ptr++;
	 }
	 
 Ptr = 0;
 // Load the English
  for (var x = 2; x < Records.length; x = x + 3)
     {
	  EnglishCard[Ptr] = Elements[x];
	  Ptr++;
	 }

}

function btnClickKnow()
{
Know = Know + 1;

     if(CurrentCard == NumberOfCards)
       {
         // Display the score
         alert("You scored " + Know + " out of " + NumberOfCards);
         CurrentCard = 0;
         Know = 0;
         DontKnow = 0;
         // clear all textboxes and put index(0) chinese character into the chinese character textbox
         
       }
CurrentCard = CurrentCard + 1;

document.getElementById("PinYin").value = "";
document.getElementById("English").value = "";
document.getElementById("ChineseCharacter").value = ChineseCard[CurrentCard];
}


function btnClickDontKnow()
{
DontKnow = DontKnow + 1
   if(CurrentCard == NumberOfCards)
       {
         // Display the score
         alert("You scored " + Know + " out of " + NumberOfCards);
         CurrentCard = 0;
         Know = 0;
         DontKnow = 0;
         // clear all textboxes and put index(0) chinese character into the chinese character textbox
       }
CurrentCard = CurrentCard + 1;

document.getElementById("PinYin").value = "";
document.getElementById("English").value = "";
document.getElementById("ChineseCharacter").value  = ChineseCard[CurrentCard];
}

function SaveToDisk(FileName, Content)
{
	try {
		netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
	} catch (e) {
		alert("Permission to save file was denied.");
	}
	var file = Components.classes["@mozilla.org/file/local;1"]
		.createInstance(Components.interfaces.nsILocalFile);
	file.initWithPath( FileName );
	if ( file.exists() == false ) {
		file.create( Components.interfaces.nsIFile.NORMAL_FILE_TYPE, 420 );
	}
	var outputStream = Components.classes["@mozilla.org/network/file-output-stream;1"]
		.createInstance( Components.interfaces.nsIFileOutputStream );

	outputStream.init( file, 0x04 | 0x08 | 0x20, 420, 0 );
	var output = Content;
	var result = outputStream.write( output, output.length );
	outputStream.close();
}

function LoadFromDisk(filePath)
{
 if(window.Components)
   try
   {
    netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
    var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
    file.initWithPath(filePath);
    if (!file.exists())
    return(null);
    var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
    inputStream.init(file, 0x01, 00004, null);
    var sInputStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
    sInputStream.init(inputStream);
    return(sInputStream.read(sInputStream.available()));
   }
   catch(e)
   {
    //alert("Exception while attempting to load\n\n" + e);
    return(false);
   }
return(null);
}

</script>
</head>
<body onload="init()">

<!-- 
*****************************************
Flash Card Player
*****************************************
-->
<div id="FlashCardPlayer" style="position: absolute; left: 0px; top: 0px;" >

<input id="ChineseCharacter" type="textbox" style="position: absolute; left: 75px; top: 5px; width: 100px; height: 100px; font-size: 35px;">
<input id="PinYin" type="textbox" style="position: absolute; left: 5px; top: 110px; width: 225px;" >
<input id="English" type="textbox" style="position: absolute; left: 5px; top: 135px; width: 225px;">
<input type="button" value="Know" style="position: absolute; left: 5px; top: 170px; width: 100px; height: 30px;" onclick="btnClickKnow();">
<input type="button" value="Dont Know" style="position: absolute; left: 125px; top: 170px; width: 100px; height: 30px;" onclick="btnClickDontKnow();">
<input type="button" value="PinYin" style="position: absolute; left: 5px; top: 210px; width: 100px; height: 30px;" onclick="btnClickShowPinYin();">
<input type="button" value="English" style="position: absolute; left: 125px; top: 210px; width: 100px; height: 30px;" onclick="btnClickShowEnglish();">

<a href="" style="position: absolute; left:10px; top: 245px;" onclick="ShowMain();">Home</a>

</div>


<!-- 
******************************************
Flashcard Editor
******************************************
-->
<div id="FlashCardEditor" style="position: absolute; left: 0px; top: 0px;">

<input id="EditChinese" style="position: absolute; left: 75px; top: 5px; width: 100px; height: 100px; font-size: 35px;" type="textbox">
<input id="EditPinYin" style="position:absolute; left: 5px; top: 110px; width: 225px;" type="textbox">
<input id="EditEnglish" style="position:absolute; left: 5px; top: 135px; width: 225px;" type="textbox">

<input id="EditClearTextButton" value="Clear" style="position:absolute; left: 5px; top: 180px; width: 100px; height: 30px;" onclick="ClearEditor();" type="button">
<input name="EditOKButton" value="OK" style="position: absolute; left: 125px; top: 180px; width: 100px; height: 30px;" onclick="WriteData();" type="button">


<a href="" style="position: absolute; left:10px; top: 225px;" onclick="javascript:Alert("*sigh* i'm getting to it!");">New</a>
<a href="" style="position: absolute; left:10px; top: 245px;" onclick="btnClickShowMain();">Home</a>
<br>

</div>




<!-- 
******************************************
Define the Layer for the Main menu
******************************************
-->

<div id="MainMenu" style="position: absolute; left: 0px; top: 0px;">
These are the instructions for the Flashcard App. In the future, there should be a score board and a selection of word lists and other such things. However, it's blank for now until i finish this app :)

<input value="Study Flashcards" style="position: absolute; left: 50px; top: 170px; width: 120px; height: 30px;" onclick="javascript:ShowPlayer();" type="button">
<input value="Edit Flashcards" style="position: absolute; left: 50px; top: 210px; width: 120px; height: 30px;" onclick="ShowEditor();" type="button">
</div>

</body>
</html>