![]() in each container of your drop-down list option. Add the following code at the end of the HTML file. ![]() ![]() If the selected value is 1, the div with id hidden-field will show otherwise it will be hidden. Step 1 - First create one node list of type nt:unstructured for the drop-down list and add below properties.ī. When an option is selected from the dropdown, the showHide() function will be executed. It’s time to get started, so let’s do it step by step. Example code: dropdownshowhide-multifield.js This code will only be triggered when you have select field with class or granite:class property with value cq-dialog-dropdown-showhide-multi unlike cq-dialog-dropdown-showhide 11. It is possible to greatly improve the user experience by strategically hiding dialog fields until a specific option is selected by the user. If dropdown and targeted element both are within same multifield item then only do show hide for this set of items. In this blog post, we will see how to use OOTB show/hide functionality for CQ-dialogs fields based on the drop-down selection in AEM.In AEM, CQ-dialogs are one of the most important components. Create input type password field, which hides text when user enters it Create Javascript function to change, input type from 'password' to 'text' to show user text Use function to toggle back input type from 'text' to 'password' to hide password again. Show/Hide cq-dialog Fields based on Drop-Down Selection In AEM by Mayur Satav If you've set the type to text/javascript and it is still not working, it's probably because the element is not loaded in the DOM.
0 Comments
Leave a Reply. |