Home/ Questions/Q 8174077
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T22:21:34+00:00

I have created a function that shows/hides different messages according to a combination of

  • 0

I have created a function that shows/hides different messages according to a combination of select dropdowns that works fine in chrome and FF using the window.onchange event. Can anyone tell me why this doesn’t work in ie and if they have a solution please.

It had to be built in tables due to internal restriction.

    ;(function(){
    document.onchange = function(){
        // Initialise variables for drop down options
        var homeMove        = document.getElementById('homeMove'),
            transferOrder   = document.getElementById('transferOrder'),
            orderComplete   = document.getElementById('orderComplete'),
            submitBtn       = document.getElementById('submitBtn');

        // Initialise variables for comments
        var comment1 = document.getElementById('comment1'),
            comment2 = document.getElementById('comment2'),
            comment3 = document.getElementById('comment3');


        if((homeMove.value == 'No') && (transferOrder.value == 'No')){
            comment2.style.display = 'none';
            comment3.style.display = 'none';
            comment1.style.display = 'block';
            submitBtn.disabled = true;
        }   

        // if Home Move - No AND Transfer Order - Yes. Display nothing. Submit button abled
        if((homeMove.value == 'No') && (transferOrder.value == 'Yes')){
            comment1.style.display = 'none';
            comment2.style.display = 'none';
            comment3.style.display = 'none';
            submitBtn.disabled = false;
        }

        // If Home Move - Yes AND Transfer Order - NO. Display comment1. Submit button disables
        if((homeMove.value == 'Yes') && (transferOrder.value == 'No')){
            comment1.style.display = 'block';
            comment2.style.display = 'none';
            comment3.style.display = 'none';
            submitBtn.disabled = true;
        }

        // If Home Move - Yes AND Transfer Order - Yes AND Order Complete - Yes. Display comment2 Subhmit button abled
        if((homeMove.value == 'Yes') && (transferOrder.value == 'Yes') && (orderComplete.value == 'Yes')){
            comment1.style.display = 'none';
            comment2.style.display = 'block';
            comment3.style.display = 'none';
            submitBtn.disabled = false;
        }   

        // If Home Move - Yes AND Transfer Order - Yes and Order Complete - No. Display comment3. Submit button disabled
        if((homeMove.value == 'Yes') && (transferOrder.value == 'Yes') && (orderComplete.value == 'No')){
            comment1.style.display = 'none';
            comment2.style.display = 'none';
            comment3.style.display = 'block';
            submitBtn.disabled = true;
        }
    }
})();

Any help with this would be great. Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    First, it would be better if instead of doing a document.change, add events to change of drop downs.

    Sometimes onpropertychange is a more sure shot event to rely on for ie. but make sure for that event, you do a subsequent check that the event is for a change in value by adding the following filter:

    yourselectboxelement.onpropertychange = function() { 
  if (window.event.propertyName == "value") {   
   // Do stuff here     
  } 
};
    • 0