Fuji - H2O
Fuji - H2O

Reputation: 387

Javascript - How to hide a drop down control if it's empty

I have a cascade dropdown on a form. User selects Document Type and most of the document type has Category. However, if a doc type does not have category then I would like to hide the category drop down. Is there a way to see if category dropdown (calculate array or something) and hide category control (by default it always show Select a value even if the drop down does not have any value to select from)

So far I have following and wondering how to evaluate category drop down control based on what user selected in the doc type drop down control.

NWF$(document).ready(function(){  
     var varDocType= NWF$('#' + jsDocTypes)// gets Doc Type control;
     varDocType.change(function(){  
          if(this.value !== null){  
            alert(varDocType.val());
            var varCategory = NWF$('#' + jsCategory)// gets Category control;
            alert(varCategory.val());
            if(varCategory == ''){
              NWF$('#' + jsCategory).style.visibility = "hidden";

           }
          }  

     });  
});

Upvotes: 1

Views: 1770

Answers (1)

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

Test this:

select:empty {
    display: none;
}
Invisible: ||<select></select>--<br>
Visible (whitespace): ||<select> </select>--<br>
Visible (children): ||<select><option>Options!</option></select>--

I do not know what is NWF$ but if you want hide an element by javascript:

TheElement.style.display = "none";

Upvotes: 2

Related Questions