www.webdeveloper.com
Results 1 to 8 of 8

Thread: function only working in ie

  1. #1
    Join Date
    Dec 2012
    Posts
    4

    function only working in ie

    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:

    Code:
    <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.

    Code:
    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);				
    		}		
    }

  2. #2
    Join Date
    Mar 2009
    Posts
    490
    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.

  3. #3
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    What does the error console say?
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  4. #4
    Join Date
    Dec 2012
    Posts
    4
    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

  5. #5
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    Quote Originally Posted by utexas10 View Post
    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.

    Code:
    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
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  6. #6
    Join Date
    Dec 2012
    Posts
    4
    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.

  7. #7
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    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).

  8. #8
    Join Date
    Dec 2012
    Posts
    4
    thanks for the explanation.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles