Question

Another newbie question from me.

Just checking whether my code below is possible. I.e creating a new array consisting of ‘document.GetElementById’s’. As i’m fairly new to javascript my code is generally a bit long winded, so please forgive the messiness.

The code below is bringing up the error ‘style.display’ is ‘null’ or not an object.
Can anyone see anything obvious i’m missing or doing wrong?

function Test(){

if(document.getElementById('inClient').value !=="FormViewer"){

    var visible =new Array("document.getElementById('personal2').value","document.getElementById('change_hours2').value");
    var change = new Array("document.getElementById('personal').value","document.getElementById('change_hours').value");

    for (var i=0; i <visible.length; i++) {
        if(visible[i]!==""){
            change[i].style.display = "block"
         }
      }
   }
}

Basically if the hidden fields (‘personal2’ etc) are blank i want the div / section (‘personal’ etc) to remain hidden but if it contains text then i want to show the section.

Thanks in advance

Answer 1

You are adding strings to your array instead of references to DOM elements. Remove the quotes and the value property and it will work. You have to check the value within the iteration.

function Test(){

if(document.getElementById('inClient').value !=="FormViewer"){

    var visible =new Array(document.getElementById('personal2'), document.getElementById('change_hours2'));
    var change = new Array(document.getElementById('personal'), document.getElementById('change_hours'));

    for (var i=0; i <visible.length; i++) {
        if(visible[i].value != ""){
            change[i].style.display = "block"
         }
      }
   }
}