Javascript displaying dynamic content

Question

I wanted to display a different message in the same <div> when the user makes a selection from a radio button. It works, but it's not as clean as I'd like. Here's the code:

<script type="text/javascript">
    function showhide(t) {
        var target = document.getElementById('bankingdetails');
        if (target.style.display == 'none') {
            var text = 'Please effect payment to the following account:<br />';
            var accountnum = 'Account Number: 39485620346<br />';
            var branchcode = 'Branch Code: 34985<br />';
            var branchname = 'Branch: F00 Bank Whoville';
            if (t == 0) {
                // User opted for Online Payment
                target.style.display = 'block';
                target.innerHTML = 'Please click here to go to PayPal:<br /><a href="http://www.paypal.com">Go to PayPal</a>';
            } else {
                target.style.display = 'block';
                target.innerHTML = text + accountnum + branchcode + branchname;
            };
        } else {
            target.style.display = 'none';
        };
    };
</script>

<input type="radio" name="radPayment" onclick="showhide(0);" />Pay Online
<input type="radio" name="radPayment" onclick="showhide(1);" />EFT

Right now, I can click either radio button to display it's message, but... I have to click it again, or click on the other one to hide the visible message.

What I'd like is to change the text that displays on the page so that if the EFT text is visible, if I click on the Pay Online button, the text will change immediately.

Thanks in advance!

Answer 1

If I understand you correctly, clicking multiple times causes the div to hide/show. You can solve this by checking always the given parameter t:

<script type="text/javascript">
    function showhide(t) {
        var target = document.getElementById('bankingdetails');

        var text = 'Please effect payment to the following account:<br />';
        var accountnum = 'Account Number: 39485620346<br />';
        var branchcode = 'Branch Code: 34985<br />';
        var branchname = 'Branch: F00 Bank Whoville';
        switch(t)
        {
            case 0:
                // User opted for Online Payment
                target.style.display = 'block';
                target.innerHTML = 'Please click here to go to PayPal:<br /><a href="http://www.paypal.com">Go to PayPal</a>';
                break;
            case 1:
                target.style.display = 'block';
                target.innerHTML = text + accountnum + branchcode + branchname;
                break;
            default:
                 target.style.display = 'none';
        }
    };
</script>