reset form works in IE but not in FF

[indupriya9]

function resetform()

{
var dropDowns = document.getElementsByTagName("select");


for (i = 0; i < dropDowns.length; i++)
{
dropDowns.selectedIndex = -1;
dropDowns[0].disabled = true;

}

is not working in FF but works in IE.

CAn anyone please help me in fixing this?

Thanks in advance
ip

}

 

[mbrooks]

Why don't you just use

document.[i]form_name[/i].reset()

M. Brooks

http://mbrooks.info

 

[indupriya9]

Hi Brooks

Thanks for your response. But I didn't get you. Do you mean just use document.form_name.reset() by itself?

Or rename the function to

function document.form_name.reset() ?

 

[BillyRayPreachersSon]

Just use document.form_name.reset() by itself... or, better still, document.forms['form_name'].reset();

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[mbrooks]

Thanks for your response. But I didn't get you. Do you mean just use document.form_name.reset() by itself?

Use this

<script type="text/javascript">
<!--//
function resetform() {
    document.[i]form_name[/i].reset()
}
//-->
</script>

<form name="[i]this_form[/i]">

<!-- add fields here -->

<input type="button" value="Reset" onClick="resetform()">
</form>

M. Brooks

http://mbrooks.info

 

[BillyRayPreachersSon]

If you're going to use an HTML element, you can get away without any JS at all:

<input type="reset" value="reset form">

Hope this helps,
Dan



[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[indupriya9]

Hi Dan and Brooks

Thanks for your responses. But what I would like the reset to do is not just reset but also to disable the first select box. The above code in my original post works fine in IE but not in FF. Is there a mistake in the way I am referencing the dropdown boxes which FF does not agree with.

In the restform function I am reseting some input boxes which works fine both in IE and FF. But for some reason the reference to select doesn't seem to work in FF.

I am posting the code I have again here that includes the reseting of input boxes as well.

function resetform() 
{


   var inputs = document.getElementsByTagName("input");
   for (i = 0; i < 17; i++) 
   {
      if (inputs[i].type == "text") 
      {
         inputs[i].value = "";
      }
   }
   	
   cadd1 = document.getElementById("txt_address1")
   cadd1.value = "<%=strcaddress1 %>";
   cadd2 = document.getElementById("txt_address2")
   cadd2.value = "<%=strcaddress2 %>";
   cadd3 = document.getElementById("txt_address3")
   cadd3.value = "<%=strcaddress3 %>";
   ccity = document.getElementById("txt_city")
   ccity.value = "<%=strccity %>";
   cphone = document.getElementById("txt_Work_Phone")
   cphone.value = "<%=strcphone %>";
   sdate = document.getElementById("txt_Start_Date")
   sdate.readonly = true;
     
	
	var dropDowns = document.getElementsByTagName("select");
  
   
   for (i = 0; i < dropDowns.length; i++) 
   {
   alert(dropDowns.length);
      dropDowns[i].selectedIndex = -1;
      dropDowns[0].disabled = true;
 
   }

}

The alert(dropDowns.length) does not bring up the alert at all.

Thanks for you help.
ip

 

[BillyRayPreachersSon]

Do you have any select elements on the page? We can't vouch that you do, because you've not shown us the HTML source.

Also, try putting the alert before the "for" statement. If it still doesn't show, you probably have a JavaScript error somewhere stopping the code from running (perhaps one of your server-side strings has a quote in it, etc? How about showing us the client-side source?)

Hope this helps,
Dan



[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[indupriya9]

Hi Dan

Here is the client side source as you requested.

function resetform() 
{


   var inputs = document.getElementsByTagName("input");
   for (i = 0; i < 17; i++) 
   {
      if (inputs[i].type == "text") 
      {
         inputs[i].value = "";
         //inputs[1].value = "";
         //alert(i);
      }
   }
   	
   cadd1 = document.getElementById("txt_address1")
   cadd1.value = "PO Box 137067";
   cadd2 = document.getElementById("txt_address2")
   cadd2.value = "";
   cadd3 = document.getElementById("txt_address3")
   cadd3.value = "Parnell";
   ccity = document.getElementById("txt_city")
   ccity.value = "Auckland";
   cphone = document.getElementById("txt_Work_Phone")
   cphone.value = "+64 (09) 356 7250";
   sdate = document.getElementById("txt_Start_Date")
   sdate.readonly = true;
   alert(sdate.value);
   //lname = document.getElementById("txt_Last_Name")
   //lname.value = "";
   //nzqa = document.getElementById("txt_Nzqa_Number")
   //nzqa.value = "";
   //dob = document.getElementById("txt_DOB")
   //dob.value = "";
 
   //strEId = ()
   //strETitle = ()
   //strEth = new Array(,new Array(strEId),new Array(strETitle))
    
	//eth = document.getElementById("Select_Ethnicity")
	
	//while (eth.options.length!=0)
	//eth.options.remove(0);
	
	//for (var i=0;i<strEId.length;i++	)
	//{
	//eth.options[i].value = strEId[i]
	//var oOption = document.createElement("OPTION")
	//oOption.value = strEId[i]
	//oOption.text = strETitle[i]
	//eth.options.add(oOption) 
	//alert(strEId[i])
	//}
	
	var dropDowns = document.getElementsByTagName("select");
  
   alert(dropDowns.length);
   for (i = 0; i < dropDowns.length; i++) 
   {
   alert(dropDowns.length);
      dropDowns[i].selectedIndex = -1;
      dropDowns[0].disabled = true;
      //dropDowns[0].style.display = "none";
      
      //dropDowns[1].selectedIndex = -1;
      //dropDowns[2].selectedIndex = -1;
   }
  
  //var strethnic = strEthnicity();
  //document.taform.MainSegment__P__ITO_Ethnicity.rText = strethnic

  //var strprev = strprevqual();
  //document.taform.MainSegement__P__ITO_Previous_Qual.rText= strprev
}

There are three select elements in the form as follows:

1st select

	<TR>
																	<TD class="Raisedcell">Select employee</TD>
																	<TD class="detailcell">
																		<SELECT id="Employee" style="WIDTH: 359px" name="MainSegment__P__Contact_Id__rText"  OnChange=popul(this.selectedIndex) >
																		<option selected> Select Employee </option> <%=StrEmpList%>
																		</SELECT>
																		<!--<INPUT language="javascript" id="Button3" type="button" value="Search" name="empSearch" />-->
																	</TD>
																</TR>

2nd select

		<TD class="detailcell" height="18"><SELECT id="Select_Ethnicity" style="WIDTH: 129px" name="MainSegment__P__ITO_Ethnicity__rText"> 
																			<option ><%=strEthnicity %></option>
																			<!--<input type=text name= "MainSegment__P__ITO_Proof_Number__rText" value="<%=strEthnicity %>"> <input type=hidden name = "MainSegment__P__ITO_Ethnicity__rText" value="<%=strEthnic %>">-->
																		</SELECT>  
																		</TD>

3rd select

<td colSpan="1" class="detailcell"><SELECT id="Select_Program" name="MainSegment__P__Qualification_Id__rText">
																			<OPTION selected>Select National Certificate</OPTION>
																			<OPTION ><%=strNCList %></OPTION>
																		</SELECT><!-- <INPUT id="program_plan" type="button" value="Plan" name="program_plan">--></td>

The function is called in a radio button as follows:

<TD class="detailcell">
																		<INPUT language="javascript" id="radio1_emp" type="radio" value="1" name="MainSegment__P__New_Contact__rBoolean" Onclick="resetform()" >&nbsp;New 
																		employee</TD>

I have shifted the alert to before the for statement with no result. And this code works wonderful in IE but does not work in FF.

Any ideas please?

Thanks
ip

 

[BillyRayPreachersSon]

Did the alert show up?

Have you tried alerting dropDowns.length to see what it contains, right before the "for" loop?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]