function only working in ie

[utexas10]

I have a function that gets called when a checkbox on the page is checked. It works fine in IE but doesn't work in chrome, on my ipad, etc.. Any advice on what needs to be updated would be appreciated. thanks

Here is the checkbox:
<input name='$id' id='$n' type='checkbox' onClick='updsrv(this.name, $amount)'> (it's in a php loop so the variables are pulled from that)

here is the 'Optional' field where the values are supposed to be displayed:

<tr id="optionalrow" style="display:none;">
		<td width="38%" align="center">&nbsp;&nbsp;</td>
		<td width="20%" align="left">&nbsp;&nbsp; Optional Amenities:</td>
		<td width="42%">$ <input type="text" name="optional" readonly="" style="border: none;color: <?php echo $textfontcolor; ?>" ></td>
	 </tr>

The function looks to see if there is a box checked on the page, if so show the field and display the amount and add up the total from a couple other fields on the page. If not, hide the optional field and take off any amounts that were previously checked.

function updsrv(a, b) 
{

	
    var eLength = document.f.elements.length;
	
	var anychecked = 'F';
    for (i=0; i<eLength; i++)
    {
        var type = f.elements[i].type;
        if (type=="checkbox" && document.f.elements[i].checked)
		{
            anychecked = 'T';
        }
    }


	if(anychecked == 'T')
		document.getElementById('optionalrow').style.display = "inline";
	else
		document.getElementById('optionalrow').style.display = "none";



		if(document.getElementById(a).checked == true)
		{	
			var amt = b * 1;
			
			var chargef = document.f.fmonth.value;
			var chargel = document.f.lmonth.value;	
			
			var addon = 0;
			
			if(chargef == 'T')
				addon = addon + amt;
				
			if(chargel == 'T')
				addon = addon + amt;		
				
			var total = document.f.totaldue.value * 1;
			var newtotal = total + addon;
			document.f.totaldue.value = newtotal.toFixed(2);	
			
			var optamt = document.f.optional.value * 1;
			var newoptamt = optamt + addon;
			document.f.optional.value = newoptamt.toFixed(2);
		}
		if(document.getElementById(a).checked == false)
		{	
			var amt = b * 1;
			
			var chargef = document.f.fmonth.value;
			var chargel = document.f.lmonth.value;	
			
			var addon = 0;
			
			if(chargef == 'T')
				addon = addon - amt;
				
			if(chargel == 'T')
				addon = addon - amt;		
				
			var total = document.f.totaldue.value * 1;
			var newtotal = total + addon;
			document.f.totaldue.value = newtotal.toFixed(2);
			
			var optamt = document.f.optional.value * 1;
			var newoptamt = optamt + addon;
			document.f.optional.value = newoptamt.toFixed(2);				
		}		
}

[Tcobb]

Where does the "f" in var eLength = document.f.elements.length; come from?

Is it the "name" of a form? If so, this probably accounts for your difficulty.

[Logic Ali]

What does the error console say?

[utexas10]

not sure why i didnt think to check the tools. in chrome it says on this line:

if(document.getElementById(a).checked == true)
error is uncaught type error:cannot read property 'checked' of null

why would it be null? i'm passing this.name in the checkbox onClick='updsrv(this.name, $amount)'. is chrome not recognizing this.name for some reason?

thanks

[Logic Ali]

not sure why i didnt think to check the tools. in chrome it says on this line:

if(document.getElementById(a).checked == true)
error is uncaught type error:cannot read property 'checked' of null

why would it be null? i'm passing this.name in the checkbox onClick='updsrv(this.name, $amount)'. is chrome not recognizing this.name for some reason?

thanks

document.getElementById means an ID is expected, not a name, but the function isn't needed because you should pass a reference to the element directly.

onClick='updsrv(this, $amount)'

Also don't address a form via its name, not least because it shouldn't have a deprecated name attribute. Either pass a reference to the form: this.form or get the reference via any of its elements: elem.form

[utexas10]

i replace this.name with just this but i'm still getting the same error. not sure what you mean in regards to addressing the form by the name?

thanks for the help.

[ReFreezed]

You must also give the input an ID attribute as well, and not just a name attribute. But as Ali says, instead of specifying the ID to the input as an argument to updsrv() it would be better to send in a reference to the actual input element (see the code in Ali's post). And then you'd switch out document.getElementById(a).checked with just a.checked (because a is the input).

[utexas10]

thanks for the explanation.