JavaScript - Getelementbyid Question - Please Help

hi, on my site he http://www.mypubspace.com/default.php I am requesting the rsCounty by Ajax, I am then trying to do the same to the page number value using getElementByID, and building up the querystring, but it's not working properly, on my countypubs.php page which is what I an requesting to get the counties I have added the function again to try and get the PAGE

Code:

<script language="javascript" type="text/javascript">

function countyFunction(){
	var countyRequest;  // The variable that makes Ajax possible!
	
	try{
		// Opera 8.0+, Firefox, Safari
		countyRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			countyRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				countyRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	countyRequest.onreadystatechange = function(){
		if(countyRequest.readyState == 4){
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = countyRequest.responseText;
		}
	}
	var name = document.getElementById('name').value;
	//var rsCounty = document.getElementById('rsCounty').value;
	var page = document.getElementById('page').value;
	var queryString = "?name=" + name + "&rsCounty=" + rsCounty + "&page=" + page;
	//Add the following line
	countyRequest.open("GET", "http://www.mypubspace.com/countypubs.php" + queryString, true);
	countyRequest.send(null);
}
</script>
<?php
$dbhost = "xxx";
$dbuser = "xxx";
$dbpass = "xxx";
$dbname = "xxx";
	//Connect to MySQL Server
mysql_connect($dbhost, $dbuser, $dbpass);
	//Select Database
mysql_select_db($dbname) or die(mysql_error());

				if ($msg <>"") 
					{
					echo "<div class=\"ui-widget\">
				<div style=\"padding: 0pt 0.7em;\" class=\"ui-state-error ui-corner-all\"> 
					<p style=\"padding-top:18px;\"><span style=\"float: left; margin-right: 0.3em;\" class=\"ui-icon ui-icon-alert\"></span> 
					<strong>Alert:</strong> $msg</p>
				</div>
			</div>"; 
					}
	$county = $_GET["rsCounty"];
	echo $county .'<br />';
	$tableName="pubs";		
	$targetpage = "default.php"; 	
	$limit = 20; 
	$query = "SELECT COUNT(*) as num FROM $tableName WHERE rsCounty = '$county'";
	$total_pages = mysql_fetch_array(mysql_query($query));
	$total_pages = $total_pages['num'];
	
	$stages = 3;
	$page = mysql_escape_string($_REQUEST['page']);
	if( isset($_REQUEST['page']) && ctype_digit($_REQUEST['page']) ) {
      $page = (int) $_GET['page'];
      $start = ($page - 1) * $limit;
}else{
      $start = 0;   
}
	
    // Get page data
	$query1 = "SELECT * FROM $tableName WHERE rsCounty = '$county' ORDER BY rsPubName Asc LIMIT $start, $limit";
	$result = mysql_query($query1);
	
	// Initial page num setup
	if ($page == 0){$page = 1;}
	$prev = $page - 1;	
	$next = $page + 1;							
	$lastpage = ceil($total_pages/$limit);		
	$LastPagem1 = $lastpage - 1;					
	
	
	$paginate = '';
	if($lastpage > 1)
	{	
		$paginate .= "<span class='paginate'>";
		// Previous
		if ($page > 1){
			$paginate.= "<a onClick='countyFunction();' id='page' value='$prev'>previous</a>";
		}else{
			$paginate.= "<span class='disabled'>previous</span>";	}
			

		
		// Pages	
		if ($lastpage < 7 + ($stages * 2))	// Not enough pages to breaking it up
		{	
			for ($counter = 1; $counter <= $lastpage; $counter++)
			{
				if ($counter == $page){
					$paginate.= "<span class='current'>$counter</span>";
				}else{
					$paginate.= "<a onClick='countyFunction();' id='page' value='$counter'>$counter</a>";}					
			}
		}
		elseif($lastpage > 5 + ($stages * 2))	// Enough pages to hide a few?
		{
			// Beginning only hide later pages
			if($page < 1 + ($stages * 2))		
			{
				for ($counter = 1; $counter < 4 + ($stages * 2); $counter++)
				{
					if ($counter == $page){
						$paginate.= "<span class='current'>$counter</span>";
					}else{
						$paginate.= "<a href='$targetpage?page=$counter'>$counter</a>";}					
				}
				$paginate.= "...";
				$paginate.= "<a href='$targetpage?page=$LastPagem1'>$LastPagem1</a>";
				$paginate.= "<a href='$targetpage?page=$lastpage'>$lastpage</a>";		
			}
			// Middle hide some front and some back
			elseif($lastpage - ($stages * 2) > $page && $page > ($stages * 2))
			{
				$paginate.= "<a href='$targetpage?page=1'>1</a>";
				$paginate.= "<a href='$targetpage?page=2'>2</a>";
				$paginate.= "...";
				for ($counter = $page - $stages; $counter <= $page + $stages; $counter++)
				{
					if ($counter == $page){
						$paginate.= "<span class='current'>$counter</span>";
					}else{
						$paginate.= "<a href='$targetpage?page=$counter'>$counter</a>";}					
				}
				$paginate.= "...";
				$paginate.= "<a href='$targetpage?page=$LastPagem1'>$LastPagem1</a>";
				$paginate.= "<a href='$targetpage?page=$lastpage'>$lastpage</a>";		
			}
			// End only hide early pages
			else
			{
				$paginate.= "<a href='$targetpage?page=1'>1</a>";
				$paginate.= "<a href='$targetpage?page=2'>2</a>";
				$paginate.= "...";
				for ($counter = $lastpage - (2 + ($stages * 2)); $counter <= $lastpage; $counter++)
				{
					if ($counter == $page){
						$paginate.= "<span class='current'>$counter</span>";
					}else{
						$paginate.= "<a href='$targetpage?page=$counter'>$counter</a>";}					
				}
			}
		}
					
				// Next
		if ($page < $counter - 1){ 
			$paginate.= "<a href='$targetpage?page=$next'>next</a>";
		}else{
			$paginate.= "<span class='disabled'>next</span>";
			}
			
		$paginate.= "</span>";		
	
	
} echo 'Pubs found: '.$total_pages;
 // pagination
 echo $paginate;
?>
<div id="ajaxCountylist">
<div id="accordion">
<?php 
 

		while($row = mysql_fetch_array($result))
		{
		
		echo '<div><h3><a href="#">'.$row['rsPubName'].', '.$row['rsTown'].'</a></h3><div>'.$row['rsAddress'].'<br />'.$row['rsTown'].', '.$row['rsCounty'].'<br />'.$row['rsPostCode'].'<br /><br />Region: '.$row['Region'].'<br /><br />Telephone: '.$row['rsTel'].'<br /><br />';
		echo '<button onclick="gohere(\'viewpub.php?PUBID='.$row['PUBID'].'\')" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">View Pub</span></button>';
		echo '</div></div>';
		
		}
		 echo '<span style="float:right;">'.$paginate.'</span>';
	?>
</div>
</div>

I have only applied teh function to the previous button and the first page numbers!

Hi, quick question:

Code:

function x() {
	document.getElementById('myid').width += 200;
}

This works for "myid", but my document contains "myid1", "myid2", "myid3", and so forth. How can I alter the script to effect every instance of "myid" followed by a number?

I have a form that is used to insert a new classified ad or to update an existing ad.
When the submit button is pressed a javascript function is called to validate the fields. Some of the fields are set as required. If the field is empty ( as form[i].value = '' ) then this sets an error flag and after all fields have been tested will display an alert and each field that has an error will be highlighted in red.
This works great when a new ad is being created, but when the ad is being updated, and a required field is erased then it doesn't popup as an error, as if the script is just ignoring it.

Here is the code snipit:
Code:

function submitbutton(mfrm) {
	var me = mfrm.elements;
	var r = new RegExp("[\<|\>|\"|\'|\%|\;|\(|\)|\&|\+|\-]", "i");
	var r_num = new RegExp("[^0-9\.,]", "i");
	var r_email = new RegExp("^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]{2,}[.][a-zA-Z]{2,3}$" ,"i");

	var errorMSG = '';
	var iserror=0;
		// set notification background color
	var warnColor = '#<?php echo $this->error_color; ?>';
	
	// loop through all input elements in form
	for (var i=0; i < me.length; i++) {
	
		// check if element is mandatory; here mosReq="1"
		if ((me[i].getAttribute('mosReq') == 1)&&(me[i].style.visibility != 'hidden')) {
			if (me[i].type == 'radio' || me[i].type == 'checkbox') {
				var rOptions = me[me[i].getAttribute('name')];
				var rChecked = 0;
				if(rOptions.length > 1) {
					for (var r=0; r < rOptions.length; r++) {
						if (rOptions[r].checked) {
							rChecked=1;
						}
					}
				} else {
					if (me[i].checked) {
						rChecked=1;
					}
				}
				if(rChecked==0) {
					errorMSG += me[i].getAttribute('mosLabel').replace('&nbsp;',' ') + ' : <?php echo html_entity_decode(addslashes(JText::_('COM_CLASSIFIEDSREDUX_REGWARN_ERROR')),ENT_QUOTES); ?>\n';
					// notify user by changing background color, in this case to red
					me[i].style.background = warnColor;
					iserror=1;
				} 
			}

			if ((me[i].value == '') || (me[i].value.length < 2)) {
				errorMSG += me[i].getAttribute('mosLabel').replace('&nbsp;',' ') + ' : <?php echo html_entity_decode(addslashes(JText::_('COM_CLASSIFIEDSREDUX_REGWARN_ERROR')),ENT_QUOTES); ?>\n';
				me[i].style.background = warnColor;
				iserror=1;
			} 
		}
	}
	
	if(iserror==1) {
		alert(errorMSG);
		return false;
	}
}

Hello,
Javascript newbie question. I am trying to write into <p> tags using getElementById(), instead of document.write() which I commented out but it does not work the way I put it. Thanks a lot if you can instruct me!

Code:

<html>
<body>

<script type="text/javascript">
var x;
var mycolors = new Array();
mycolors[0] = "blue";
mycolors[1] = "orange";
mycolors[2] = "green";



for (x=0; x<mycolors.length; x++)
  {
var output = mycolors[x] + "<br />"
document.getElementById("output").innerHTML=output; //instead of document.write(output);
  }
</script>

<p id="output"></>

</body>
</html>

Hi,

I am new to javascript. Been picking up bits and parts but am bumping my head against walls.
Have table with 4 cols and 2 rows - header row and 2nd row with 3 input text boxes and 1 option list. Have an array to adds rows to table when user clicks button-max-3 more rows. Option list not a problem-propagates values. Row 1 - 1st and 2nd input boxes linked to JQuery for datapicker and 4th calls js validation for numeric input.
When user adds row those links are not there-which is what I need. Array cites input boxes with name and iteration of +1 for each added row. Should I use, in the array,
document.getElementById('startdate0'; document.getElementById('startdate1'); etc., or should I use keyword this? And if I use this, how is it applied?
I do not know how to declare these variables for recognition. Tried several methods without success.
Following is array:
Code:

<script language="Javascript" type="text/javascript">
/*<![CDATA[*/
		   
	var new_rows=new Array();
	var row_count=0;

     function addRow()
     {
          var tbl = document.getElementById('ReqDtTbl');
		  new_rows[row_count]=new Array();
          var lastRow = tbl.rows.length;
          var iteration = lastRow;
		  if (lastRow>4){
			  return;}
          var row = tbl.insertRow(lastRow);
		  var cellLeft = row.insertCell(0);
          var textNode = document.createElement('input');          
		  textNode.size = 7;
		  textNode.name = 'startdate' + iteration;		  
          cellLeft.appendChild(textNode); 
		  new_rows[row_count]['cell']=textNode;
          var cellRight = row.insertCell(1);          
          var el = document.createElement('input');          
          el.type = 'text';          
          el.name = 'enddate' + iteration;          
          el.id = 'enddate' + iteration;          
          el.size = 7; 
		  new_rows[row_count]['cell2']=el;
          cellRight.appendChild(el);          
          // the last cell!
          var cellRightSel = row.insertCell(2);          
          var sel = document.createElement('select');          
          sel.name = 'TypeHrs' + iteration;          
          sel.options[0] = new Option('-Select-', '""');
          sel.options[1] = new Option('Comp Time', 'Comp Time');
          sel.options[2] = new Option('Credit Hrs', 'Credit Hrs');
		  sel.options[3] = new Option('Overtime', 'Overtime');
		  sel.options[4] = new Option('Rel Comp', 'Rel Comp');          
          cellRightSel.appendChild(sel);
		  new_rows[row_count]['cell3']=sel;
		  var cellRight = row.insertCell(3);          
          var el = document.createElement('input');          
          el.type = 'text';          
          el.name = 'No. of Hours' + iteration;          
          el.id = 'No. of Hours' + iteration;          
          el.size = 7;         
          cellRight.appendChild(el);
		  
		  new_rows[row_count]['cell']=el;
		  row_count++;
     }
     function removeRow()
     {
          // grab element again
          var tbl = document.getElementById('ReqDtTbl');
          // grab length
          var lastRow = tbl.rows.length;
          // delete last row if there is more than one row
          if (lastRow > 2) tbl.deleteRow(lastRow - 1);
     }
	 /*]]>*/
</script>

Input box for date is:

Code:

<input style="width: 70px" type="text" id="startdate">

Function is:

Code:

<script type="text/javascript">
$(function() {
		$("#startdate").datepicker();
		$("#enddate").datepicker();
		$("#RcompStart").datepicker();
		$("#RcompEnd").datepicker();
	});
</script>

Input for numeric is:

Code:

<input type="text" name="No. of Hours" id="No. of Hours" style="width: 70px;" onblur="checkQuarters(this);" />

And numeric validation function is:

Code:

<script type="text/javascript">
function checkQuarters( fld )
{
    var val = parseFloat(fld.value);
    if ( isNaN(val) || ( val*4 != Math.floor(val*4) ) )
    {
        alert("Value must be a numeric and a multiple of 0.25");
        return false;
    }
    return true;
}
</script>

Thanks - John

Hey guys,

Thanks for taking the time to read my post. I am not new to programming or scripting, but I am completely new to javascript and web-based code. Hopefully you guys could help me understand what is going on and maybe help me figure out what I am trying to do.

What I am trying to do:
-There is an element that has a value
<td class="flashField" onmouseover="clearAnswer()">
<div id="flashAnswer" onmouseover="clearAnswer()">answer string here</div>
</td>

-There is a text box that needs to have the answer above given to it
<td class="flashField">
<input type="text" tabindex="1" onkeypress="clearAnswer()" name="q" maxlength="256" size="50">
</td>

-There is a next button that needs to be executed
<td align="right">
<input type="image" tabindex="2" alt="Next" src="http://website.com/images/next.gif">
</td>

So what I am trying to do is create a script through Greasemonkey that will automatically do these things. I am starting small and trying to just get the value of flashAnswer to appear as an alert on the screen by using this code:
var answer = document.getElementById('flashAnswer');
alert(answer);

But the problem is it posts some weird value ([object XrayWrapper [object HTMLDivElement]]) that most definitely is not "answer string here" and is a bit above me at this point. Any ideas?

Any help would be great guys!

Thanks!
-ellosiph

Alright so i've been trying to code a layout with multiple 'frames'
. What I usually do is use the following script:

Code:

<center>
<script>
          function changeNavigation(id) 
          {document.getElementById('navigate').innerHTML=document.getElementById(id).innerHTML}
          </script>
          <noembed>
          <body>
          
        
          </noembed>

And then add all the divs which are linked to an imagemap, like this:

Code:

<img src="IMAGE" width="HERE" height="HERE" border="0" usemap="#ImageMap1">
<div style="width:HEREpx; height:HEREpx; position:absolute; left:HEREpx; top:HEREpx; z-index:1; overflow:auto;" 
id="HERE">
Blaa
</div>
<div style="display:none; overflow=none"; id="HERE">
And add as many as I need of these.
</div>
<map name="ImageMap1">
<area shape="HERE" coords="HERE" name="HERE"
onClick="changeNavigation('HERE')">
</map>

This always works fine when I have one 'navigation' frame. However this time I need to code a layout with multiple frames. I have tried starting a new script and linking to a new imagemap to do that. But what it does is it duplicates the image and the divs dont appear when clicking on a 'button'.
This is the layout I am coding
As you can see, each box has its own 'buttons' which should link to a div. I can do it for one of the boxes and its divs, but cant figure out how to do it for the others so it works.

Did my best to make this sound non-confusing. Hopefully someone will be able to help.

http://johnathany.com/contact.html

What I'm trying to do is get the googlemaps iframe to change if i hit to corresponding 3 links at the bottom.

So I tried to use getElementById(leftcolumn).innerhtml to change the entire content of the div but it isnt working.
Please advise.

Or would there be a simpler solution like creating 3 hidden divs and just do display:block; to display them?

I am using javascript for adding and removing rows from table as per user require ment like if we press ADDROW button it adds extra row to table and if we pressREMOVEROW it delets the last row.. Now i want to access the data from textbox like this..
var crpt = document.getElementById("itrtr2").value; //no. of rows
for(var k=1;k<=crpt;k++)
{
qtyc = document.getElementById("txtRowc3"+k).value;
unit_pricec = document.getElementById("txtRowc5"+k).value;
alert('QTYC:'+qtyc+' UPC:'+unit_pricec);
cttl = qtyc * unit_pricec;
document.getElementById("txtRowc6"+k).value = cttl.toFixed(2);
csbttl = csbttl + cttl;
}
document.getElementById("subttlC").value=csbttl.toFixed(2);

it shows the value of textRowc3i in qtyc in alert box but also givs error document.getElementById("txtRowc3"+k) is null..
I tried for this but problem is not solved please help... Thank You...

Any help would be greatly appreciated! I'm using javascript to create a slideshow of images with thumbnails. The slideshow works fine, the titles show up great, but my problem arises when I try to replace the href source of a div. [larger], specified in the js is supposed to be replacing the current a href source, but it isn't working.

This is the javascript that controls the slideshow:
Code:

var current = 0;

function swapimg( show ){

	var piece = new Array();
	var title = new Array();
	var larger = new Array();
	var meta = new Array();


	piece[0] = '../assets/images/nokia/nokia01.jpg';
	title[0] = '[ One ]';
	larger[0] = '../assets/images/nokia/nokia01_big.jpg';
	
	
	piece[1] = '../images/nokia/nokia02.png';
	title[1] = '[ Two ]';
	larger[1] = '../assets/images/nokia/nokia02_big.jpg';

	piece[2] = '../assets/images/nokia/nokia03.png';
	title[2] = '[ Three ]';
	larger[2] = '../assets/images/nokia/nokia02_big.jpg';

	piece[3] = '../assets/images/nokia/nokia04.png';
	title[3] = '[ Four ]';
	larger[3] = '../assets/images/nokia/nokia02_big.jpg';

	
	document.getElementById( 'featured' ).src = piece[show];
	document.getElementById( 'featured' ).alt = title[show];
	document.getElementById( 'featuretitle' ).innerHTML = title[show];
	document.getElementById( 'featuremeta' ).innerHTML = meta[show];
	document.getElementById( 'featurelarger' ).href = larger[show];
	
	for( i = 0; i < meta.length; i++ ){
		document.getElementById( 'item' + i ).style.opacity = '.5';
	}
	document.getElementById( 'item' + ( show ) ).style.opacity = '.99';
	
	current = ( show );
}

And this is the portion of the html that is supposed to be working with the [larger], but I'm having troubles with:

Code:

<div class="featurelarger"><a href="../assets/images/nokia/nokia01_big.jpg" id="featurelarger" class="thickbox" title="Windowcling" rel="gallery-art" >view larger</a></div>

Any help would be greatly appreciated, thank you in advance!

None of my getElementById (or other) references produce anything but "undefined." This occurs in the latest versions of Fx, IE, Chrome, and Safari, so it must be something I am doing but not not seeing here. I have boiled it down to the following without success, and wonder whether there is some add on interaction. Fx 3.6.12 has the problem with this code:

<code>
<html>
<head>
<title>This is a test of getElementById</title>
</head>
<body>
<div id="area" name="area_name">xxx</div>
<script type="text/javascript">
var divs = document.getElementsByTagName('div');
var msg = '';
msg = 'Divs[0] contains ' + divs[0] + ' with width = ' + divs[0].width + "\n";
msg +='Test area width by id = ' + document.getElementById('area').width + "\n";
msg +='Test area width by name = ' + document.getElementsByName('area_name').width;
alert(msg);
</script>
</body>
</html>
</code>

I've spent three days trying to figure this out without any luck.
What i am attemping to do is to open an unframed tab using the link from a frame id. I want to be able to enter a js command in the browser on the page then have it open in a new tab unframed or just reload the link unframed. These are the commands i have tried in my browser:


javascript:<a herf="document.getElementById("netlinkx").childNodes[1].src;">

javascript:<a herf="window.location.href=document.getElementById("netlinkx").childNodes[1].src;">

javascript:<a herf=document.getElementById("netlinkx").children[0]>.setAttribute('id','this_one');alert(getFrame("this_one").body.innerHTML);>

and a few others that didn't work.

What I'm trying to get are the tag ids separately after I call the callback function. I've been racking my brain for far too long on this one. Here is a shorter version of what I have. I'm using the array's length to count and break into their own lines.

How do i get all 9 id="hover_[index]" separately using my array length?

PHP Code:
var info = Array("bla_1", "bla_2", "bla_3", "bla_4", "bla_5", "bla_6", "bla_7", "bla_8", "bla_9");

function callback(results, status) {
    if (status == myStatus) {
        for (var i = 0; i < results.length; i++) {
            send(results[i]);
        }
    }
} 
function send(info) {    
    document.getElementById('results').innerHTML += "<div id='hover_"+info.length+"'>Something</div>";
    hover_target = document.getElementById('hover_'+info.length);// how do i get all 9 hover_[index] separately?
    someEvent.addDomListener(hover_target, 'mouseover', function() {
        // do something
    });
} 


Thank you so much in advance,
Frank

Hi,
I asked this question in an earlier post where Dormilich asked me to post the code, which I did twice but for some reason it hasn't posted so I'll try with a new thread....

I am passing a variable to a function in a separate .js file using embedded HTML.
I want to use the parameter in a getElementById but I can't get it to work.

Here's my HTML:
Code:

<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT"> 
<!--
window.onload = function ()
{
initSlideDownMenu("accordionactivity");
}
//-->
</SCRIPT>

Here's my javascript function. When the first alert pops up I get 'accordionactivity', when the second one pops up I get '[object]' but when the third one pops up I get 'null'.The rest of the function then doesn't work properly either:
Code:

function initSlideDownMenu(slMenuName)
{

alert(slMenuName);
alert(document.getElementById('accordionactivity'));
alert(document.getElementById(slMenuName));

 dhtmlgoodies_slmenuObj = document.getElementById(slMenuName);
 dhtmlgoodies_slmenuObj.style.visibility='visible';
 var mainUl = dhtmlgoodies_slmenuObj.getElementsByTagName('UL')[0];  
 var mainMenuItem = mainUl.getElementsByTagName('LI')[0];
 mainItemCounter = 1;
 while(mainMenuItem){   
  if(mainMenuItem.tagName=='LI'){
   var aTag = mainMenuItem.getElementsByTagName('A')[0];
   var subUl = mainMenuItem.getElementsByTagName('UL');
   if(subUl.length>0){
    mainMenuItem.id = 'mainMenuItem' + mainItemCounter;
    initSubItems(subUl[0],2);
    aTag.onclick = showSubMenu;
    mainItemCounter++;
   }    
  }   
  mainMenuItem = mainMenuItem.nextSibling; 
 }  
 if(location.search.indexOf('mainMenuItemToSlide')>=0){
  var items = location.search.split('&');
  for(var no=0;no<items.length;no++){
   if(items[no].indexOf('mainMenuItemToSlide')>=0){
    values = items[no].split('=');
    showSubMenu(false,document.getElementById('mainMenuItem' + values[1])); 
    initMenuIdToExpand = false;    
   }
  }   
 }else if(expandFirstItemAutomatically>0){
  if(document.getElementById('mainMenuItem' + expandFirstItemAutomatically)){
   showSubMenu(false,document.getElementById('mainMenuItem' + expandFirstItemAutomatically));
   initMenuIdToExpand = false;
  }
 }
 if(expandMenuItemByUrl)
 {
  var aTags = dhtmlgoodies_slmenuObj.getElementsByTagName('A');
  for(var no=0;no<aTags.length;no++){
   var hrefToCheckOn = aTags[no].href;
   if(location.href.indexOf(hrefToCheckOn)==0 && (location.href.length==hrefToCheckOn.length || 

location.href.indexOf('?')==hrefToCheckOn.length)){
    initMenuIdToExpand = false;
    var obj = aTags[no].parentNode;
    while(obj && obj.id!=slMenuName){
     if(obj.tagName=='LI'){       
      var subUl = obj.getElementsByTagName('UL');
      if(initialMenuItemAlwaysExpanded)alwaysExpanedItems[obj.parentNode] = true;
      if(subUl.length>0){        
       objectsToExpand.unshift(obj);
      }
     }
     obj = obj.parentNode; 
    }
    showSubMenu(false,objectsToExpand[0]);
    break;     
   }   
  }
 }
 if(initMenuIdToExpand)
 {
  objectsToExpand = new Array();
  var obj = document.getElementById(initMenuIdToExpand)
  while(obj && obj.id!=slMenuName){
   if(obj.tagName=='LI'){
    var subUl = obj.getElementsByTagName('UL');
    if(initialMenuItemAlwaysExpanded)alwaysExpanedItems[obj.parentNode] = true;
    if(subUl.length>0){      
     objectsToExpand.unshift(obj);
    }
   }
   obj = obj.parentNode; 
  }
  showSubMenu(false,objectsToExpand[0]);
 }
}

Can you help me figure out what I'm doing wrong?
Thank you!

I have a html file and a separate javascript file.

The html file contains: <input type="reset" id = "resetButton" />

I want a message to pop up if the reset button is pressed.

So in the js file I have:
document.getElementById("resetButton").onclick = doAlert;

doAlert is a function that simply does: alert("Do you want to reset?");

I know my separate js file is linked correctly because if I just put in alert("hello"); in the js file then it works. But if I use the document.getElementById thing in the js file, then there is an error. The error, according to the error console, says that "resetButton" is null. Can someone help me? thanks!

btw, I'm totally new to programming...and I need to do this for my homework assignment