Does anyone know why this doesn't work in Firefox?

[richrock]

Works fine in other browsers I've tested so far (Chrome & Safari) 

 

<script type='text/javascript'>

// TODO - this does not work if FF - other browsers are fine.
function showPaypal(paypal_value) {

	var src_value = paypal_value;


	var target = 'paypal_details';
	var settingvalue = document.getElementById('showpal_value').value;

	if(src_value == 'on') {
		document.getElementById('paypal_details').style.visibility = 'visible';
	} else {
		document.getElementById('paypal_details').style.visibility = 'hidden';
	}

	alert(document.getElementById('paypal_details').style.visibility);

}
</script>

 

The html bit is this

 

<input type="checkbox" name="showpal" id="showpal_value" onclick="showPaypal(value);" <?php if($agent_show == 'checked') { echo "checked=\"checked\" "; } ?>/>
<?php echo $agent_show . "<br />"; ?>

<div id="paypal_details">
<?php echo $paypal_code; ?>
</div>

 

I can't see anything technically wrong, and it's from a tutorial (modified to suit my needs).  Sorry for all the JS questions, but it's not my strongest point, though I am learning quicky! 

[Zane]

What exactly "doesn't work"?

[Omirion]

onclick="showPaypal(value)

Are you passing a correct value here?

If the var value is undefined here your code can potentially break.

[richrock]

Sorry, I was a bit vague 

 

Basically, in Firefox, the element paypal_details will show on a onclick event, but not hide when the element is clicked again.  This works in other browsers, but not FF.  I have firebug installed, but it doesn't show any errors when it fails to hide the div.

 

As for value, I'm sure that can be removed.  It wasn't working before I added that, and still didn't work afterwards,  so I don't think thats the issue.

 

Thanks

[Adam]

As Omirion pointed out, value doesn't appear to be a valid value. The target and settingvalue definitions appear to be redundant code. Plus would it not be better to hide the element with display:none?

 

Personally I'd rewrite your function, seems a little dodgey to me:

 

   function togglePaypal(obj) {
      var ppd = document.getElementById('paypal_details');
      if (ppd.style.display == 'none') {
         ppd.style.display = 'block';
      } else {
         ppd.style.display = 'none';
      }
   }

 

 

Then just call it with:

 

onclick="togglePaypal(this);"

[richrock]

Hey, would you look at that.  It works!!! 

 

Thanks very much guys, you've saved my hair - only to let it go greyer.... 

[Adam]

Reading back I kind of modified yours, you can actually remove the 'obj' parameter from in the function declaration and 'this' from the call.