Avatar of diecasthft01
diecasthft01
 asked on

Javascript visible/hidden with CF and IE11

Good morning all!! I have a question related to ColdFusion, JavaScript and IE11. I have some code, that works fine in compatibility view in IE11, that basically is three drop downs, all containing results of a database query. Only the first dropdown is visible at the beginning. If the user selects "More" from the first drop down box, the second box becomes visible. Then if in that second box, a users selects a certain item, the third box will appear. I need to make this work without the dependency of adding the domain to the compatibility view. I thought it would work with no issues, but I was very wrong. Could someone guide me on what I need to change/do to make this work??

<SCRIPT LANGUAGE="JavaScript">	  
function objectShowForm(thisObject, thatObject) {

     // Check for invalid object references
     if (!thisObject || !thatObject) {return false;}
     
     // Get the selected value 
     // (currently only works with single selection lists and text fields)
     if (thisObject.type == "select-one") {
          listIndex = thisObject.selectedIndex;
          var value = thisObject.options[listIndex].value; // you can also use .text
     } else if (thisObject.type == "text") {
          var value = thisObject.value;
     }

     // Show or hide the hidden field
     if (value == "99"){
          showElement(thatObject.name);
     } else {
          hideElement(thatObject.name);
     }
     return true;
}
	
function showElement(elem) {
     if (!elem) {return false;}     // check for invalid object reference
     document.getElementById(elem).style.visibility='visible';
     return true;
}

function hideElement(elem) {
     if (!elem) {return false;} // check for invalid object reference
     document.getElementById(elem).style.visibility='hidden';
     return true;
}	
</script>	  
	
<cfoutput>         
<cfform>

<table width="900" border="0" bgcolor="CCCCCC" style="margin-left: -10"> 
 <TR>
<td width="115">      
 <select id="select1" name="userID" size="1" onChange="objectShowForm(this, this.form.optother); selectUser(this)">
<option value="999">Select</option>
<CFLOOP query="getContact">
<option value="#getContact.FUNDING_TO#">#getContact.FUNDING_TO#</option></CFLOOP>
<OPTION value="99">More</OPTION>
</SELECT></TD>

<td width="194"><select id="select2" name="optother" size="1" style="visibility: hidden;">
<option value="999">Select</option>
<CFLOOP query="getContact1">
<option value="#getContact1.FUNDING_TO#">#getContact1.FUNDING_TO#</option></CFLOOP>
</SELECT></td>

<td width="418"><select id="select3" name="optotherPM" size="1" style="visibility: hidden;">
<option value="999">Select</option>
<CFLOOP query="getContact2">
<option value="#getContact2.FUNDING_TO#">#getContact2.FUNDING_TO#</option></cfloop>
</SELECT></td>
</tr></table>  

</cfform></CFOUTPUT>

Open in new window

JavaScriptColdFusion Language

Avatar of undefined
Last Comment
diecasthft01

8/22/2022 - Mon
Nikoloz Khelashvili

have you tried just hidden attribute?
diecasthft01

ASKER
Instead of JavaScript??
Nikoloz Khelashvili

no, just with javascript,

document.getElementById(elem).hidden = true;

Open in new window

All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck
Nikoloz Khelashvili

you can use by setting css display style as well:


document.getElementById(elem).style.display = "none";

Open in new window

diecasthft01

ASKER
I'm not a big javascript guy so I may be misunderstanding. So I tried both ways, and still didn't get the second box to show visible on selection of the first box, but I may have done that wrong. I replaced the:

document.getElementById(elem).style.visibility='visible';

with

document.getElementById(elem).hidden = true;
ASKER CERTIFIED SOLUTION
Nikoloz Khelashvili

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
diecasthft01

ASKER
I'll try that and see what happens....
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
diecasthft01

ASKER
Thanks a lot!!! That pointed me in the right direction and I believe I have what I need.