[Javascript] Newbie question

Schalk schalk at volume4.com
Sat Dec 3 07:19:23 CST 2005


Roger Roelofs wrote:
> Schalk,
>
> On Dec 1, 2005, at 1:39 PM, Schalk wrote:
>
>> Thanks Peter, that will help but, maybe I should rephrase my 
>> question. I have a form and at the end I give the user between 2 - 3 
>> payment options. When they click on one of these (radio buttons) the 
>> appropriate form fields should show below these radio buttons.
>>
>> If for example the user chooses credit card, onlt fields relevant to 
>> a credit card should show and all others hidden and so forth. Thanks!
>
> If the fields you want to show/hide are in fieldsets, all you have to 
> do is set the className of the fieldsets after you know which radio 
> button they clicked.  In fact, you probably want to show all fieldsets 
> and hide them on page load in the same manner.  That way, if the user 
> has javascript turned off they can still use the form.
>
> I
Thanks everyone!

Here is the code I have so far:

function shf_init() {   
    // get array of radio buttons to recursively attach the event listener
    // and trigger the showHideFieldset function.
    var payment_type = document.forms.eprc_store.payment_type;
    // get specific fieldsets to show hide
    var show_c = document.getElementById("c-info");
    var show_cc = document.getElementById("cc-info");   
   
    show_c.style.display = "none";
    show_cc.style.display = "none";
   
    for(var i=0;i<payment_type.length;i++) {
        payment_type[i].addEventListener('click',showHideFieldset,false);
    }
}
function showHideFieldset() {
    // get specific radio buttons to check for the checked property
    var radio_c = document.getElementById("payment_type2");
    var radio_cc = document.getElementById("payment_type3");
    // get specific fieldsets to show hide
    var show_c = document.getElementById("c-info");
    var show_cc = document.getElementById("cc-info");
   
    if(radio_c.checked) {
        show_c.style.display = "block";
        show_cc.style.display = "none";
   
    } else if(radio_cc.checked) {
        show_cc.style.display = "block";
        show_c.style.display = "none";
    }
}
window.onload=function(){
    shf_init();
    // add other functions here.
}

It works perfectly in Firefox but IE (6.0) throws an error:
Line 14
Char 3
Error: Object doesn't support this property or method.

Why is this? Does IE not support W3C DOM level 2?

Also, how can I define the following two lines once and have it shared 
across functions?
// get specific fieldsets to show hide
    var show_c = document.getElementById("c-info");
    var show_cc = document.getElementById("cc-info");

Thank you for all of your help and pointers.

-- 
Kind Regards
Schalk Neethling
Web Developer.Designer.Programmer.President
Volume4.Business.Solution.Developers





More information about the Javascript mailing list