saguaro Posted May 16, 2012 Report Share Posted May 16, 2012 I was able to show/hide a div based on the selection of a normal dropdown field using hints from this topic: http://forums.caspio.com/index.php/topic/3466-using-parameters-to-dynamically-hide-sections/ It worked great, thanks.However, now I want to do the same thing, except the "Yes/No" value in the field that controls the show/hide is a virtual field in a cascading dropdown. If the virtual field is "yes", I want the section to display. If "no", it should remain hidden. I have tried various versions of the code shown on this topic (above), but not sure how to make it work.The cascading virtual field is "Virtual1" and the div to show/hide has ID "HideSharing".I have this code in the footer: <script type="text/javascript"> var dropdown2 = document.getElementsByName('cbParamVirtual1')[0]; dropdown2.onchange = function() { var dropdown2 = document.getElementsByName('cbParamVirtual1')[0]; var hidableSection2 = document.getElementByID('HideSharing'); hidableSection2.style.display = dropdown2.options[dropdown2.selectedIndex].value == 'Yes' ? 'inline' : 'none'; } </script> Any help would be appreciated. Quote Link to comment Share on other sites More sharing options...
MayMusic Posted May 17, 2012 Report Share Posted May 17, 2012 Can you please provide the URL of the page so I can take a look at the code? Quote Link to comment Share on other sites More sharing options...
saguaro Posted May 25, 2012 Author Report Share Posted May 25, 2012 Thanks for looking at this MayMusic. I put a simple test page together to demonstrate the use. http://b3.caspio.com/dp.asp?AppKey=db0a10008a87dadc13c2476fbe52 This page is a form, but I would use it in forms as well as detail pages. I appreciate your help! Quote Link to comment Share on other sites More sharing options...
HongTaiLang Posted June 8, 2012 Report Share Posted June 8, 2012 Please check this link which may help you: http://forums.caspio.com/index.php/topic/3603-conditional-dropdown/The same example here, but using button: http://howto.caspio.com/tech-tips/creating-collapsible-sections.html Quote Link to comment Share on other sites More sharing options...
MayMusic Posted June 12, 2012 Report Share Posted June 12, 2012 Please try this and let me know if it works for you: <script type="text/javascript"> var dropdown2 = document.getElementsByName('cbParamVirtual1')[0]; function f_hide() { var hidableSection2 = document.getElementById('HideSharing'); hidableSection2.style.display = dropdown2.options[dropdown2.selectedIndex].value == 'Yes'?'inline':'none'; } document.getElementsByName('cbParamVirtual1')[0].onchange = f_hide; </script> Quote Link to comment Share on other sites More sharing options...
saguaro Posted June 18, 2012 Author Report Share Posted June 18, 2012 Thanks MayMusic. I copied the page and swapped out the javascript in the footer as you suggested. The new page is available at http://b3.caspio.com/dp.asp?AppKey=db0a1000f27fd200f88b481087ba but is still not working. My HTML block is: If Virtual1 = Yes, this div should display Is there something else I should try? Quote Link to comment Share on other sites More sharing options...
MayMusic Posted June 21, 2012 Report Share Posted June 21, 2012 what is the browser you are using?? It is working in Firefox but not in IE. I am looking into it to see where the problem is :!: :!: :!: Quote Link to comment Share on other sites More sharing options...
saguaro Posted June 26, 2012 Author Report Share Posted June 26, 2012 I am using IE9. After your post, I tested in FireFox, Chrome, and Safari and had success with each of those. So, there is apparently something in the code that IE does not like. The user base for this will be using IE exclusively, so a fix is definitely needed. Thanks for looking at it! Quote Link to comment Share on other sites More sharing options...
ankhanh Posted July 4, 2012 Report Share Posted July 4, 2012 Great information! Thanks so much, guys! Quote Link to comment Share on other sites More sharing options...
ShWolf Posted July 9, 2012 Report Share Posted July 9, 2012 Hi, According to the http://www.w3.org/TR/REC-html40/interact/scripts.html#h-18.2.3, in the IE browsers "The onchange event occurs when a control loses the input focus and its value has been modified since gaining focus". Searching for the other solution. Quote Link to comment Share on other sites More sharing options...
Kurumi Posted May 13, 2019 Report Share Posted May 13, 2019 You could try Rules when it comes to hiding/showing sections. You may check this article: https://howto.caspio.com/datapages/forms/conditional-forms/ I hope this helps! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.